JSFiddle - React, Tailwind, and code Playground

by diaryfakta

HTML

<div class='btn_df'><a href='#'>Button</a>

CSS

.btn_df{
font-family:arial;
font-size:20px;
color:#000;
background:#E1496F;
padding:5px;
height:auto;
width:100px;
border-radius:20px;
text-align:center;
box-shadow:2px 1px 1px #000;
}
.btn_df a:link{
color:#fff;
text-decoration:none;
}
.btn_df:active{
position:relative;
top:2px;
border: 1px solid hsla(0,0%,0%,.25);
border-radius:20px;
box-shadow: 2px 2px 5px hsla(0,0%,100%,.5),-2px -2px 5px hsla(0,0%,0%,.5),inset 5px 5px 15px hsla(0,0%,0%,.5);
}
.btn_df a:visited{color:#fff;}