<div class="image"></div>
.image {
mask-image: url('https://habrastorage.org/webt/ep/fs/pi/epfspiamd5syagxn_q4a0q6n-9m.png');
mask-size: 100px;
mask-repeat: no-repeat;
background: linear-gradient(to right, #04ff00, #ff0000);
width: 100px;
height: 100px;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.