Fork of Sol LeWitt Reproduction Vertical

100%

Fork of Sol LeWitt Reproduction Vertical

✓ Published1🌍 Public

Last edited Dec 27, 2023

Created on Dec 27, 2023

This example reproduces a Sol LeWitt–style geometric drawing using raw SVG and JavaScript. It displays a grid of alternating horizontal and vertical stripes that are revealed through two circular mask regions at the center of the canvas. The code creates an SVG element, defines two mask layers—one with a white circle on black and another with a black circle on white—and appends 100 horizontal and 100 vertical rectangles. Each rectangle is clipped by one of the masks, producing the contrasting stripe pattern without any external libraries.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction T

This example reproduces a Sol LeWitt geometric artwork using raw SVG elements in a full-window canvas. It shows a grid of thin vertical and horizontal lines intersecting to form a striped pattern, with a central circular region and a small square cutout highlighted by masks. The code creates two SVG masks—one with a black background and white circle/square, another with white background and black circle—to selectively show line orientations: horizontal stripes appear inside the circle, while vertical stripes appear outside it. Using plain JavaScript DOM methods like `createElementNS` and `setAttribute`, it generates 100 rectangles in each direction without any external libraries.

IisTeamoor

94% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired geometric drawing using raw SVG elements created via the JavaScript DOM API. It shows a grid of blue horizontal bands and red vertical bands, with a white circular mask that reveals both sets of stripes within its radius against a black background. The code constructs an SVG mask and applies it to rectangles tiled across the viewport, using mask elements and fixed pixel offsets to generate the layered pattern. No external libraries are used; the rendering relies entirely on native browser SVG and DOM manipulation.

Ccrees00

94% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using only SVG and JavaScript, creating a grid of alternating horizontal and vertical bands. Two circular masks reveal the layered strokes: the first mask exposes vertical strips within a centered circle, while the second inverts that region to show horizontal strips outside it. The code generates 100 rectangles per direction, each 10 pixels thick, using the `document.createElementNS` API and SVG `mask` elements to compose the visual interplay. The result is a clean, geometric abstraction that mimics the artist’s instructional art style.

Mmavercikalvin

94% 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

94% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired geometric composition entirely through SVG elements. It shows a grid of horizontal and vertical bands that intersect within a centered circular boundary, creating a patterned interplay of lines and negative space. The code constructs the visualization using raw JavaScript and the SVG DOM API, creating two masks—one with a black background and white circle, the other with the inverse—to alternately reveal horizontal stripes inside the circle and vertical stripes outside it. One hundred rectangles are generated for each orientation, each masked to produce the final layered effect.

AAWLGAWLG

94% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using only JavaScript and the SVG API. A central circular mask reveals a grid of horizontal black lines in the center of the viewport, while a second inverted mask allows vertical black lines to appear only outside the same circle, creating a striking contrast. The code dynamically creates all SVG elements—including masks, rectangles, and circles—based on the browser window dimensions, generating 100 horizontal and 100 vertical stripes that intersect in a pattern defined by the two masks.

Mmagswo

94% match

Loading thumbnail…

Fork of Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt drawing using only raw SVG and JavaScript, with no external libraries. It displays a grid of alternating horizontal and vertical lines that remain visible only within two intersecting circular masks, creating a dynamic visual interplay between the line directions. The code builds the SVG dynamically by appending a set of horizontal rectangles masked by a black/white circle, and vertical rectangles masked by an inverse circle, both centered on the screen. The rendering relies on native SVG mask elements and DOM manipulation in plain JavaScript.

MMaras13

93% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG and JavaScript, with no external libraries. It shows a grid of horizontal and vertical bars that intersect within two circular masks, creating a geometric composition of alternating stripes and gaps. The code generates 100 horizontal rectangles across the full width and 100 vertical rectangles down the full height, each masked to reveal only the areas inside the circles. The masks are constructed with SVG `mask` elements, combining black and white rects and circles to control visibility, and the result is a clean, minimal visualization of layered line patterns.

BBharath Vijay

93% match