Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt reproduction Mask

✓ Published1🌍 Public
ZzolboBatsaikhan
Last edited Aug 29, 2022
Created on Aug 29, 2022

This example reproduces a Sol LeWitt art piece as an interactive SVG visualization. It shows a field of vertical rectangular stripes that are fully visible outside a central circular area, where they are masked out to reveal a blank region. The code uses raw JavaScript and DOM manipulation to construct an SVG `mask` element containing a white background rectangle and a black circle, then applies that mask to 100 overlapping vertical rectangles via the `url(#circle-mask)` reference. The rendering approach is purely procedural, generating shapes directly with `document.createElementNS` without any external data or libraries.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using SVG elements and mask-based compositing. It shows a grid of horizontal and vertical stripes that intersect within a central circular region, creating a geometric pattern where line orientations alternate inside and outside the circle. The code uses raw SVG DOM manipulation via `createElementNS` to build rectangles and defines two masks (`circle-mask` and `circle-mask-2`) to control visibility. Horizontal stripes appear inside the circle, while vertical stripes fill the outer area, demonstrating how SVG masks can selectively reveal layered shapes.

MMarcus Vinicius da Silveira Richa
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-style drawing using raw SVG elements and mask manipulation. The visualization renders a series of overlapping horizontal and vertical stripes by creating rectangles and applying circular SVG masks to confine their visibility, producing a geometric composition. The code uses DOM manipulation via `createElementNS` and `setAttribute` to construct the SVG, with two distinct masks (`circle-mask` and `circle-mask-2`) controlling different stripe patterns. The result is a monochromatic, grid-based artwork where varying rectangle heights and widths generate a rhythmic, minimalist pattern across the full viewport.

NNeel Mehta
92% match
Loading thumbnail…

Fork of Sol Lewitt Reproduction mask

This example reproduces a Sol LeWitt-inspired geometric composition by drawing 100 horizontal stripes across the full browser window. A circular SVG mask, defined with a black circle over a white rectangle, reveals only the central region of the stripes, creating a circular vignette effect. The code constructs all elements dynamically using the raw Document Object Model (DOM) API, including `document.createElementNS` and `setAttribute`, without relying on external libraries. The mask and rectangles are appended directly to an SVG element sized to match the viewport dimensions.

Kkwambokar
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction Mask

A fork of Sol LeWitt’s geometric art, this visualization renders a series of horizontal black stripes across the full browser window, with a circular region in the center masked out to reveal the white background. The composition uses an SVG `mask` element to create the circle, while JavaScript dynamically generates 100 rectangles, each 10 pixels tall, and applies the mask to them. The code relies on native SVG APIs, including `createElementNS` and `setAttribute`, without any external libraries.

CCurran Kelleher
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece as an interactive SVG composition. It shows a circular mask revealing horizontal and vertical striped bands, while a second inverted mask exposes the same structure in negative space. The code uses raw SVG APIs to create masks, rectangles, and circles without external libraries, generating 200 striped rectangles dynamically via nested loops. The rendering approach relies on SVG mask elements to layer and alternate visibility across the full viewport.

VVlad Tukhtarov
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using raw SVG. A circular mask reveals a set of horizontal, evenly spaced rectangles that span the full width of the viewport, creating a striped pattern confined to a central circle. The code constructs the SVG dynamically via the `document.createElementNS` API, setting the mask’s circle radius to 200 pixels and drawing 100 rectangles at 20-pixel intervals with 10-pixel heights. No external libraries are used; the rendering relies entirely on native browser SVG elements and attributes.

Mmatrice-one
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This fork of a Sol LeWitt reproduction renders a minimalist geometric composition using raw SVG and the DOM API. It shows a circular mask centered on the viewport, with a white outer ring and black inner circle, through which 100 horizontal striped rectangles are displayed. Each rectangle is created with `document.createElementNS`, assigned a fixed height and y-position, and clipped using an SVG `mask` element. The piece relies entirely on JavaScript and SVG primitives rather than any external libraries or datasets.

Zzaioris
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This piece renders an abstract, generative composition inspired by Sol LeWitt’s wall drawings. It shows a circular mask overlaid with two sets of alternating horizontal and vertical stripes, creating a crosshatch pattern that fades to reveal a central white circle against a black background. The code uses the SVG API via JavaScript to create a full-viewport canvas, dynamically setting element attributes like width, height, and mask references. Two SVG masks (`circle-mask` and `circle-mask-2`) define the visible regions for the 100 horizontal and vertical rectangles drawn in looping iterations.

BBelma Besirevic
91% match