JSFiddle - React, Tailwind, and code Playground

HTML

<div class="abox"></div>


<div class="test"></div>

CSS

.abox {
    width:100px;
    height:100px;
    background-color: red;
    border-left-color: rgb(0, 255, 87);
    border-left-style: solid;
    border-left-width: 10px;
    border-right-color: rgb(0, 255, 87);
    border-right-style: solid;
    border-right-width: 10px;
    border-bottom-color: rgb(0, 255, 87);
    border-bottom-style: solid;
    border-bottom-width: 10px;
    border-top-color: rgb(0, 255, 87);
    border-top-style: solid;
    border-top-width: 10px;
    border-top-left-radius:20px;
    border-top-right-radius:20px;
    border-bottom-left-radius:20px;
    border-bottom-right-radius:20px;    
    
    -moz-box-shadow: 0 0 0 0 rgb(127, 127, 127),0 0 0 0 rgb(127, 127, 127) inset;
    -webkit-box-shadow: 0 0 0 0 rgb(255, 255, 255),0 0 0 0 rgb(127, 127, 127) inset;
    box-shadow: 0 0 0 0 rgb(127, 127, 127),0 0 0 0 rgb(127, 127, 127) inset;
}