🌍 Public
Viewing a saved revision (read-only)
e4733151788e431fb05e47ee0ced3ae0
SVG Masks
This example shows how SVG masks can punch a heart-shaped hole through a solid red circle, leaving the surrounding area visible. A `<mask>` element defines the cutout using a black rectangle for invisible regions and a white path for the visible heart shape. The mask is applied to a `<circle>` via the `mask` attribute, with the heart path drawn using an SVG arc and quadratic Bézier commands. The page is plain HTML with inline CSS and JavaScript, requiring no external libraries.
AI-generated descriptionA bare minimum HTML page demonstrating use of CSS and JavaScript.
See also React Starter.