How Do I Fit An Image To The Shape Of This Png Image In Css?

How do I fit an image over this png image but keep the shape? in CSS? I've seen there is ways to do this with SVG clip path but I was wonder if there was a quicker way by just sett

Solution 1:

this is the purpose of mask:

img {
  -webkit-mask:url(https://i.ibb.co/mBrmH0k/Mf15d.png) center/contain no-repeat;
}

<imgsrc="https://picsum.photos/id/1079/200/200"><imgsrc="https://picsum.photos/id/1069/200/200">