JSFiddle - React, Tailwind, and code Playground

HTML

<div class="image"><img class="pg-image" src="http://i.guim.co.uk/static/w-620/h--/q-95/sys-images/Guardian/Pix/pictures/2015/1/30/1422631112598/2340075f-69ad-443b-9770-2dd03049f474-bestSizeAvailable.jpeg" alt="Something"></div>
<div class="overlay"></div>

CSS

.overlay {
    background-color: rgba(55, 155, 55, 0.5);
    bottom:0;
    left: 0;
    opacity: 0.5;
    position: absolute;
    right:0;
    top:0;
    z-index: 1;
}
.image{position:relative;}