JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <body>
<a href="#" title="Test link" class="button">Link</a>
    </body>
</html>

CSS

body { background:#e5e5e5; }
a.button {
    background:#545454;
    background:-webkit-gradient(linear, left top, left bottom, from(#545454), to(#373737));
    background:-webkit-linear-gradient(top, #545454, #373737);
    background:-moz-linear-gradient(top, #545454, #373737);
    background:-ms-linear-gradient(top, #545454, #373737);
    background:-o-linear-gradient(top, #545454, #373737);
    background:linear-gradient(top, #545454, #373737);
    -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px;
    border:1px solid #2c2c2c;
    color:#fff;
    float:left;
    height:28px;
    line-height:28px;
    padding:0 8px;
    text-transform:uppercase;
    -moz-text-shadow:0 -1px 1px rgba(0,0,0,.3);-webkit-text-shadow:0 -1px 1px rgba(0,0,0,.3);text-shadow:0 -1px 1px rgba(0,0,0,.3);
    width:auto;
    box-shadow:-4px 4px 5px rgba(0,0,0,.28);
}
a.button:hover,
a.button:focus {
    background:#ff5f01;
    background:-webkit-gradient(linear, left top, left bottom, from(#f89728), to(#ff5f01));
    background:-webkit-linear-gradient(top, #f89728, #ff5f01);
    background:-moz-linear-gradient(top, #f89728, #ff5f01);
    background:-ms-linear-gradient(top, #f89728, #ff5f01);
    background:-o-linear-gradient(top, #f89728, #ff5f01);
    background:linear-gradient(top, #f89728, #ff5f01);
    border-color:#e75500;
    text-decoration:none;
    -moz-text-shadow:0 -1px 1px rgba(0,0,0,.3);-webkit-text-shadow:0 -1px 1px rgba(0,0,0,.3);text-shadow:0 -1px 1px rgba(0,0,0,.3);
    box-shadow:0 4px 0 rgba(0,0,0,.1);
}