JSFiddle - React, Tailwind, and code Playground

by josekerekes

HTML

<div id="photo-frame">
        <img src="http://lorempixel.com/400/200/" alt="Image1" /> 
</div>

CSS

html {background:#00BFFF;width:100%;height:100%}
#photo-frame {display:inline-block;position:relative; padding:20px;}
#photo-frame:after
{
 content: "";
 display: block;
 position: absolute;
    top:0;
    left:0;
 width: 100%;
 height: 100%; 

 border-radius: 10px;
 background-color: rgba(0,0,0,0.1); 
 box-shadow: 
             inset 0 -15px 80px rgba(0,0,0,0.4),
             0 5px 10px rgba(0,0,0,0.5);

}
#photo-frame img {position:relative;z-index:99}