CodePen Embed - Mask with image included in SVG

<div class="container">
  <svg viewBox="0 0 400 300">
    <defs>
      <mask id="mask">
        <rect fill="#000000" x="0" y="0" width="400" height="300"></rect>
        <circle fill="#FFFFFF" cx="150" cy="150" r="100" />
        <circle fill="#FFFFFF" cx="50" cy="50" r="150" />
      </mask>
    </defs>
    <image mask="url(#mask)" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="https://assets.codepen.io/5928893/masking-balloons.jpg" width="400" height="300"></image>
  </svg>

This Pen is owned by web.dev on CodePen.

See more by @web-dot-dev on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.