JSFiddle - React, Tailwind, and code Playground

by Ajey

HTML

<a href="#" target="_blank" class="available">Available for freelaning</a>

CSS

.available {
background: #33a730;
width: 100%;
min-height: 30%;
height: auto;
border: none;
border-radius: 20px;
transition: 0.5s ease;
padding: 7px;
color: #f2f2f2;
vertical-align: middle;
align: center;
}

.available:hover {
text-decoration: none;
border-radius: 0px;
color: #f2f2f2;
}