JSFiddle - React, Tailwind, and code Playground
by envira
HTML
<a href="#" class="button">Envira</a>CSS
.button {
text-transform: uppercase;
font-family: Helvetica, Arial, Tahoma, Sans-serif;
letter-spacing:1.97px;
color: #C6463D;
background: #FFF;
border-radius: 2px;
padding: 8px 14px;
text-shadow: none;
display: inline-block;
box-sizing: border-box;
-moz-box-sizing: border-box;
border: 3px solid #C6463D;
box-shadow: inset 0 0 0 0 #C6463D;
transition: 0.7s;
-webkit-transition: 0.7s;
-moz-transition: 0.7s;
text-decoration:none;
}
.button:hover {
box-shadow: inset 0 100px 0 0 #C6463D;
background: #C6463D;
color:#FFF;
}