<img src="https://kryogenix.org/images/css-jagged-kitten.jpg" alt="a lovely kitten">
+
<img src="https://kryogenix.org/images/css-jagged-cors/css-jagged-utah.png" alt="The Utah Teapot as a white mask image on a transparent background">
=
<img id="masked" src="https://kryogenix.org/images/css-jagged-kitten.jpg" alt="the kitten, masked">

body {
  background: #666;
  display: flex;
  font-size: 100px;
  color: white;
  font-weight: bold;
  align-items: center;
  justify-content: space-between;
}

#masked {
    -webkit-mask-image: url(https://kryogenix.org/images/css-jagged-cors/css-jagged-utah.png);
    mask-image: url(https://kryogenix.org/images/css-jagged-cors/css-jagged-utah.png);
    -webkit-mask-position: left bottom;
    mask-position: left bottom;
}