/ Gists / Overlay on image with 1 line of code (border-image)
On gists

Overlay on image with 1 line of code (border-image)

CSS trick

demo.css Raw # 

/* https://codepen.io/kevinpowell/pen/yLWNbdJ */

.overlay {
  border-image: linear-gradient(hsl(240 100% 20% / 0.6), hsl(0 100% 20% / 0.6))
    fill 1;
}