Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt reproduction circle

✓ Published1🌍 Public
Jjonathanh21
Last edited Aug 28, 2022
Created on Aug 28, 2022

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.

AI-generated description

A reproduction of Sol LeWitt art piece

MIT Licensed

Similar vizzes

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
92% match
Loading thumbnail…

Fork of 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.

Nnitika1234567
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt drawing by layering two sets of striped rectangles over a central circular mask. A grid of horizontal and vertical bars is clipped to reveal a circle in the center, while the surrounding area shows only one orientation of stripes. Using plain JavaScript and the SVG API, it dynamically creates `rect` elements and applies two `mask` definitions with intersecting `circle` and `rect` shapes to alternate the visible stripes. The code runs entirely in the browser with no external libraries.

EErika Tomakic
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This page reproduces a Sol LeWitt drawing using an SVG mask to create a circular viewport. The code generates 100 horizontal and 100 vertical stripes, masking each set so that the horizontal lines appear within a central circle, while the vertical lines are visible outside it, producing a clean geometric contrast. It uses the SVG DOM API directly, creating elements via `document.createElementNS` and applying masks with `url(#circle-mask)` and `url(#circle-mask-2)`. The composition adapts to the browser window’s current dimensions with no data source beyond the generated shapes.

JJane
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This page reproduces a Sol LeWitt drawing using an SVG mask to create a circular viewport. The code generates 100 horizontal and 100 vertical stripes, masking each set so that the horizontal lines appear within a central circle, while the vertical lines are visible outside it, producing a clean geometric contrast. It uses the SVG DOM API directly, creating elements via `document.createElementNS` and applying masks with `url(#circle-mask)` and `url(#circle-mask-2)`. The composition adapts to the browser window’s current dimensions with no data source beyond the generated shapes.

JJane
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-style geometric composition using raw SVG and JavaScript, rendering a canvas-sized circular mask layered over intersecting horizontal and vertical bands. The page builds an SVG scene with two circle masks: one reveals a grid of horizontal rectangles, while an inverse mask exposes vertical rectangles, creating a Moiré-like pattern. The code constructs elements via the DOM API (`document.createElementNS`, `setAttribute`) and appends them to the SVG root, with masks defined as `<mask>` elements containing `<rect>` and `<circle>` shapes. No external libraries are used; all rendering relies on native SVG primitives and inline styling.

Ttwospikesfpg@gmail.com
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using two sets of horizontal and vertical stripes that interact with a circular mask. The circle at the center masks the horizontal stripes, while an inverted mask allows vertical stripes to appear only inside a second circular region. The code builds an SVG dynamically with JavaScript, creating 100 striped rectangles in each orientation and applying SVG masks to achieve the visual effect. It demonstrates a stark, geometric composition based on the artist’s generative instructions.

Xxyzcorrupt@gmail.com
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