JSFiddle - React, Tailwind, and code Playground
by Victor
HTML
<span class="wrap"><a href="" class="cancel" >cancel</a></span>
CSS
.cancel {
display:block;
border-radius:10px;
border-top:1px solid #ED7E89;
border-bottom:1px solid #ED7E89;
border-left:1px solid #ED7E89;
border-right:1px solid #ED7E89;
background: rgb(251,78,47);
margin:-2px;
background: -moz-linear-gradient(top, rgba(251,78,47,1) 0%, rgba(247,109,87,1) 26%, rgba(246,44,18,1) 100%, rgba(241,47,29,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(251,78,47,1)), color-stop(26%,rgba(247,109,87,1)), color-stop(100%,rgba(246,44,18,1)), color-stop(100%,rgba(241,47,29,1)));
background: -webkit-linear-gradient(top, rgba(251,78,47,1) 0%,rgba(247,109,87,1) 26%,rgba(246,44,18,1) 100%,rgba(241,47,29,1) 100%);
background: -o-linear-gradient(top, rgba(251,78,47,1) 0%,rgba(247,109,87,1) 26%,rgba(246,44,18,1) 100%,rgba(241,47,29,1) 100%);
background: -ms-linear-gradient(top, rgba(251,78,47,1) 0%,rgba(247,109,87,1) 26%,rgba(246,44,18,1) 100%,rgba(241,47,29,1) 100%);
background: linear-gradient(to bottom, rgba(251,78,47,1) 0%,rgba(247,109,87,1) 26%,rgba(246,44,18,1) 100%,rgba(241,47,29,1) 100%);
}
.wrap {
display:block;
border-radius:10px;
border-top:2px solid #F2495A;
border-bottom:2px solid #F2495A;
border-left:2px solid #F2495A;
border-right:2px solid #F2495A;
}