JSFiddle - React, Tailwind, and code Playground

HTML

<div class="test1">MY AWESOME CONTENT</div>

<div class="test2_1"><div class="test2_2">MY NOT SO AWESOME CONTENT(but still ok)</div></div>

CSS

.test1
{
    box-shadow: -30px 0px 10px 10px #888888;
    
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
}


.test2_1
{
    box-shadow: -30px 10px 20px 10px #888888;
    
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
}
.test2_2
{
    box-shadow: -30px -10px 20px 10px #888888;
}