JSFiddle - React, Tailwind, and code Playground

by zeen

HTML

<div class="container">
    <div class="box"></div>
</div>

CSS

.box {
    background: rgba(255, 0, 0, 0.5) url('https://lh3.googleusercontent.com/-WLG16BYHvuA/AAAAAAAAAAI/AAAAAAAAABE/R3LhbrNg_a0/photo.jpg?sz=50');
    width: 100px;
    height: 100px;
    background-blend-mode: difference;
}

.container {
    width: 300px;
    height: 300px;
    border: 2px solid black;
    background: black;
}