JSFiddle - React, Tailwind, and code Playground

HTML

<div class="button">Upgrade for more</div>

CSS

.button {
background: #E0349A; /* old browsers */
background: -moz-linear-gradient(top, #EBA8D4 0%, #E0349A 52%, #E0349A 100%); /* firefox */

background: -webkit-gradient(
  linear, left bottom, left top, color-stop(1, #EBA8D4),
    color-stop(0.5, #E0349A),
    color-stop(0, #E0349A)
); /* webkit */

color: #fff;
width: 140px;
height: 30px;
font: bold 13px/30px Helvetica, sans-serif;
text-shadow: 0 -1px rgba(0, 0, 0, 0.3);

-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
text-align: center;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
-mox-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3), inset 0 -5px 15px #E0349A;
-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3), inset 0 -5px 15px #E0349A; 

    overflow: hidden;
    
}

.button span {
display: block;
height: 100px;
-webkit-box-shadow: inset 0 -10px 15px #E0349A; 
}