JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#">Test</a>

CSS

a {
    -webkit-box-shadow: inset 0 0 30px #00f, 0 0 30px #00f;
    -moz-box-shadow: inset 0 0 30px #00f, 0 0 30px #00f;
    box-shadow: inset 0 0 30px #00f, 0 0 30px #00f;
    
    -webkit-border-radius: 28px;
    -moz-border-radius: 28px;
    border-radius: 28px;
}

a {
    background: #168bff;
    display: block;
    width: 100px;
    height: 40px;
    padding-top: 20px;
    margin: 20px;
    text-decoration: none;
    font: bold 17px Helvetica, Arial, sans-serif;
    color: #fff;
    text-align: center
}

a:hover {
    -webkit-box-shadow: inset 0 0 30px #f00, 0 0 30px #f00;
    -moz-box-shadow: inset 0 0 30px #f00, 0 0 30px #f00;
    box-shadow: inset 0 0 30px #f00, 0 0 30px #f00;
    
    background: #f56565;
}