Skip to main content
SimilarExport ZIP
100%

Ep. 3.3 - SoL LeWitt Art Reproduction Vertical - MK

✓ Published1🌍 Public
Mmattykuch
Last edited Aug 10, 2022
Created on Aug 10, 2022

This example reproduces a Sol LeWitt-inspired drawing using the raw SVG API and the DOM’s `createElementNS` method. It renders 100 horizontal and 100 vertical gray rectangles in a grid, with all horizontal bars clipped by a circular mask applied via an SVG `<mask>` element. The mask, centered on the viewport, reveals only the horizontal strokes inside its 200-pixel radius while the vertical bars remain fully visible, creating a layered geometric pattern. The visualization uses `window.innerWidth` and `window.innerHeight` to size the full-screen canvas.

AI-generated description

A demo of SoL LeWitt Art.

MIT Licensed

Similar vizzes

Loading thumbnail…

Ep. 3.4 - SoL LeWitt Art Reproduction Final - MK

This example reproduces a Sol LeWitt–style wall drawing using SVG masks to create intersecting stripe patterns. A central circular mask reveals a grid of horizontal and vertical colored bands, while a second inverted mask swaps the visible regions, producing a layered composition of alternating line orientations. The code builds all elements programmatically via the raw SVG DOM API, generating 100 horizontal and 100 vertical rectangles with the `createElementNS` method. No external libraries are used; the full-screen visualization relies solely on native SVG mask and rectangle elements.

Mmattykuch
93% match
Loading thumbnail…

Ep. 3.2 - SoL LeWitt Art Reproduction - MK

This example reproduces a Sol LeWitt-style wall drawing using raw SVG. It shows a series of one hundred thin vertical rectangles evenly spaced across the full browser viewport, creating a minimalist striped pattern. The code generates the SVG element dynamically via the DOM API `document.createElementNS`, setting its width and height to match `window.innerWidth` and `window.innerHeight`. Each rectangle is positioned at a fixed increment of 20 pixels along the x-axis, with a width of 10 pixels and a height equal to the viewport, resulting in a regular, repeating visual rhythm.

Mmattykuch
91% match
Loading thumbnail…

Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-style drawing using raw SVG elements created via the `document.createElementNS` API. It shows a grid of thin horizontal and vertical rectangles that are revealed only within two circular regions at the center of the screen, achieved through SVG masks. The first mask uses a white circle on a black background to show the horizontal bars, while the second mask inverts the colors to display the vertical bars. The layout adapts to the window size, and the 100 bars in each direction are generated procedurally with no external data source.

Aadityapalliyil0@gmail.com
84% match
Loading thumbnail…

Le03 Sol LeWitt Reproduction Vertical

This example reproduces Sol LeWitt’s vertical line drawing using raw SVG and the Document Object Model (DOM) API. It displays a grid of 100 horizontal and 100 vertical black bars on a white background, with two circular masks applied to the bars to create a central, circular region where the lines appear to overlap. The first mask reveals the horizontal bars inside a black-bordered circle, while the second mask hides the vertical bars in the same circle, producing a visual inversion. The code constructs all elements via `document.createElementNS` and sets attributes directly, without any external visualization library.

CColin Frutschi
83% match
Loading thumbnail…

Sol LeWitt Repro Vertical

This example reproduces a Sol LeWitt drawing using the SVG API. It displays a grid of horizontal and vertical black bars on a white background, creating an intersecting pattern. A circular mask reveals only the horizontal lines within its radius, while a second, inverted mask reveals only the vertical lines outside that same circle. The code constructs the masks and bars dynamically with `createElementNS` and `setAttribute`, using the document’s width and height for full-screen coverage.

SSam Hege
83% match
Loading thumbnail…

Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-inspired drawing using raw SVG and JavaScript, displaying a grid of narrow horizontal rectangles that become visible only within a central circular mask. The code creates an SVG canvas via `document.createElementNS`, defines a mask with a single circle, and generates 100 stacked `<rect>` elements, each 10 pixels tall, that intersect the mask to form the final composition. The result is a precise, minimal geometric pattern whose vertical bands are revealed through the circular aperture, mimicking the clean, systematic aesthetic of LeWitt's wall drawings without any external libraries.

AAndre J Denais
83% match
Loading thumbnail…

Sol LeWitt Reproduction AG

This example reproduces a Sol LeWitt wall drawing using SVG masks and layered rectangles. The code creates two circular masks, one with a black background and white circle, the other inverted, then applies them to 100 horizontal and 100 vertical bars. The result is a grid of intersecting lines visible only within the circular regions, mimicking the geometric precision of LeWitt’s conceptual art. It uses raw SVG DOM manipulation via `document.createElementNS` and mask attributes, with no external libraries.

Gguththered
83% match
Loading thumbnail…

Sol Lewitt Reproduction vertical

This example reproduces a Sol LeWitt-style geometric art piece using raw SVG and JavaScript. It shows a full-screen vertical grid of thin horizontal and vertical lines, with a central circular region highlighted by a mask. The rendering relies on the SVG `mask` element and dynamically created `rect` elements, using standard DOM APIs like `document.createElementNS`. The horizontal lines are clipped to a circle via the mask, while vertical lines span the full height, creating a layered, minimal composition.

JJinpeng Li
82% match