JSFiddle - React, Tailwind, and code Playground
HTML
<div class="wrapper">
<div class="img"></div>
</div>
CSS
.wrapper {
height:400px;
background: linear-gradient(135deg, red,30%, transparent);
}
.img {
height:100%;
background: url("https://i.pinimg.com/originals/d2/91/28/d291286be03d19513f4f43ca12a7284c.jpg");
background-size: cover;
}