JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>

CSS

body {
  background: black;
}

div {
  display: inline-block;
  width: 400px;
  height: 400px;
  background: linear-gradient(to right, red, green);
  -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0));
}