JSFiddle - React, Tailwind, and code Playground

by abhitalks

HTML

<div id="grad"></div>

CSS

#grad {
        width: 60px;
        height: 60px;
        position: absolute;
        top: 32px; left: 32px;
        clip: rect(auto 30px 60px auto);
}
 
#grad:after  {
        content: '';
        position: absolute;
        background-color: rgba(0,0,0, .7);
        top: 8px;
        bottom: 8px;
        left: 8px;
        right: 8px;
        -webkit-transform:rotate(-45deg);
        background-image: -webkit-gradient(
                linear,right bottom,left bottom,
                color-stop(.75, #52882d),
                color-stop(0,  #eee)
        );
        border: 1px solid #fff;
}