JSFiddle - React, Tailwind, and code Playground

HTML

<div class="transparent">
    <div></div>
</div>

CSS

div.transparent
{
    width: 400px;
    height: 400px;
    position: relative;
}

div.transparent:after
{
    background-color: #000;
    opacity: 0.1;
    
    content: ' ';
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;   
    left: 0px;     
}

div > div
{
    position: relative;
    z-index: 1;
    width: 200px;;
    height: 200px;
    background-color: #FFF;
}