Fork of Sol LeWitt reproduction circle

100%

Fork of Sol LeWitt reproduction circle

✓ Published0🌍 Public

Last edited Aug 2, 2022

Created on Aug 2, 2022

Forked from Sol LeWitt reproduction circle

This example reproduces Sol LeWitt’s geometric wall drawing using purely SVG and JavaScript DOM APIs. A circular mask is applied over a grid of horizontal and vertical rectangle strips, with two complementary masks alternating light and dark bands. The result is a clean, mask-based rendering of intersecting lines confined to a circle, created dynamically without any external visualization libraries. The code relies on raw SVG element creation and mask definitions to achieve the effect.

AI-generated description

A reproduction of Sol LeWitt art piece

MIT Licensed

Similar vizzes

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 circle

This example reproduces a Sol LeWitt wall drawing by generating two intersecting sets of striped rectangles within a circular mask on an SVG canvas. One set of horizontal bands is clipped by a white circle mask, while a second set of vertical bands is clipped by an inverted black circle mask, creating a checkerboard-like pattern inside the circle. The code uses raw JavaScript and the SVG DOM API, creating elements with `document.createElementNS` and applying masks via `url(#circle-mask)` and `url(#circle-mask-2)`. The rectangles are laid out programmatically in two loops of 100 iterations each.

Jjonathanh21

92% match

Loading thumbnail…

Fork of Sol LeWitt reproduction circle

This example recreates Sol LeWitt’s geometric wall drawing using overlapping horizontal and vertical striped bands. A central circle is isolated through two SVG masks: one shows the horizontal stripes inside the circle, while the other reveals vertical stripes outside it. The code builds the SVG entirely via native DOM methods like `document.createElementNS` and `setAttribute`, with no external libraries. Each stripe is a thin rectangle, and the masks are defined with black-and-white fill patterns to clip the 100 stripes per direction.

AAbdure-bit

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

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using an SVG rendering approach. It displays a grid of horizontal and vertical lines that intersect within two circular masks, creating a nested geometric pattern centered on the screen. The code constructs SVG elements dynamically via the Document API, using `createElementNS` to build rectangles and circles. Two masks (`circle-mask` and `circle-mask-2`) control visibility: the first reveals horizontal stripes inside a 200-pixel-radius circle, while the second exposes vertical stripes in the surrounding area, producing a layered, minimalist composition.

NNeel Mehta

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

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This fork of a Sol LeWitt reproduction generates an abstract, grid-based composition entirely with SVG elements. It shows a central circular mask that reveals alternating horizontal and vertical stripes across the full screen. The code creates two masks—one with a black background and white circle, another with a white background and black circle—to control which stripes are visible. It uses the raw SVG DOM API via `document.createElementNS` to draw 100 horizontal rectangles and 100 vertical rectangles, each 10 pixels thick, with the masks applied to create the overlapping circle effect. No external libraries are used; only native JavaScript and SVG.

KKusumaKumariDama@my.unt.edu

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

91% match