Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of SVG Fundamentals Horizontal

Public visualization

Viewing a saved revision (read-only)

b53aa65af1c64839bc22ebc6f443b897

Fork of SVG Fundamentals Horizontal

0 stars1🌍 Public
SSidney Oluoch
Last edited Aug 17, 2022
Created on Aug 17, 2022
Forked from SVG Fundamentals

This example demonstrates SVG masking by confining a pattern of horizontal and vertical lines to a circular region at the center of the screen. The code generates 100 horizontal strips and 100 vertical strips using the `document.createElementNS` API, while a mask containing a white circle over a black rectangle restricts visibility of the horizontal lines. The result is a grid where only the intersection inside the circle remains visible, created entirely with vanilla JavaScript and no external libraries.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.