JSFiddle - React, Tailwind, and code Playground

HTML

<div class="thumbnail">
  <img src="https://picsum.photos/640/480" alt="" class="image">
</div>

SCSS

.thumbnail {
  display: inline-block;
  position: relative;
  z-index: 1;
  
  &::before {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    content: '';
    background: rgba(128,128,255,0.5);
  }

  .image {
    display: block;
  }
}