JSFiddle - React, Tailwind, and code Playground

HTML

<button>Save This</button>
<br>
<br/>
<span class="button"><span class="before"></span>Save This<span class="after">Save This</span></span>

CSS

button::-moz-focus-inner{padding:0;border:0;}

button, .button {    line-height: 29px; border: solid 1px #464747; background: #6d6e6f; color: #fff;    position: relative; display: inline-block; margin: 0; padding:0 12px; font-family: Verdana; font-size: 12px; font-weight: bold;
    -webkit-border-radius: 11px;
    -khtml-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 11px;
    
    -webkit-box-shadow: 0 0 5px rgba(0,0,0,1);
    -moz-box-shadow: 0 0 5px rgba(0,0,0,1);
    box-shadow: 0 0 5px rgba(0,0,0,1);
}

button::before, .button .before { content: ''; width: 100%; height: 50%; background: #868687; position: absolute; top: 0; left: 0;
    -webkit-border-radius: 11px 11px 16px 16px / 11px 11px 2px 2px;
    -khtml-border-radius: 11px 11px 16px 16px / 11px 11px 2px 2px;
    -moz-border-radius: 11px 11px 16px 16px / 11px 11px 2px 2px;
    border-radius: 11px 11px 16px 16px / 11px 11px 2px 2px;
}

button::after { content: attr(data-content); position:absolute; padding: 0 12px; top:0; left:0;}

.button .after { position:absolute; top:0; left:0; padding: 0 12px; }

button:hover, .button:hover { background:#808182; }

button:hover::before, .button:hover .before { background:#959697; }

button:active, .button:active { border-color:#9b9b9b; 
    background: rgb(104,105,107);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#68696b', endColorstr='#67686a',GradientType=0 );    
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(104,105,107,1)), color-stop(16%, rgba(89,90,92,1)), color-stop(32%, rgba(72,72,72,1)), color-stop(48%, rgba(63,63,63,1)), color-stop(60%, rgba(66,66,66,1)), color-stop(80%, rgba(84,85,87,1)), color-stop(88%, rgba(94,95,97,1)), color-stop(100%, rgba(103,104,106,1)));
    background: -webkit-linear-gradient(top, rgba(104,105,107,1) 0%,rgba(89,90,92,1) 16%,rgba(72,72,72,1) 32%,rgba(63,63,63,1) 48%,rgba(66,66,66,1) 60%,rgba(84,85,87,1) 80%,rgba(94,95,97,1)...

JavaScript

$('button').each(function() {
    $(this).attr('data-content', $(this).val() || $(this).text())
});