Joe LeWitt Reproduction Vertical

100%

Joe LeWitt Reproduction Vertical

✓ Published2🌍 Public

Last edited May 22, 2022

Created on May 22, 2022

This SVG reproduction of a Sol LeWitt art piece creates a vertical composition of intersecting horizontal and vertical bands. The rendering uses JavaScript to generate 100 horizontal and 100 vertical rectangles, each with a height or width of 10 pixels and spaced 20 pixels apart, which are then constrained by circular masks centered on the canvas. Two masks, `circle-mask` and `circle-mask2`, define circular regions that reveal only a portion of the striped grid, producing a dynamic interplay between the geometric lines and the negative space. The artwork is built entirely with native SVG elements and the DOM API, sized to the full browser window.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Joe LeWitt Reproduction

This piece reproduces the geometric aesthetic of a Sol LeWitt wall drawing using SVG rectangles. The code generates one hundred vertical bars, each ten pixels wide, spaced evenly across the full height of the browser window. It directly manipulates the SVG DOM via `document.createElementNS` and `setAttribute` in vanilla JavaScript, without any external libraries. The composition fills the viewport based on `window.innerWidth` and `window.innerHeight`, creating a minimal, systematic grid that echoes LeWitt’s instructional art.

Ccssergio

90% match

Loading thumbnail…

Fork of Joe LeWitt Reproduction

This piece generates 100 vertical and 100 horizontal rectangular bars across the full canvas. Two SVG masks, each combining a white rectangle with a black or white circle, constrain the bars into two circular regions at the center. The code directly creates SVG elements via the DOM API, with no external libraries, and is a reproduction of a Sol LeWitt artwork.

Ccssergio

86% match

Loading thumbnail…

Sol LeWitt Reproduction Vertical

This reproduction of a Sol LeWitt wall drawing uses SVG to display two sets of perpendicular, evenly spaced horizontal and vertical lines. A circular mask restricts the visible pattern to a central disc, creating a clean, geometric composition. The code uses the Document API (`document.createElementNS`) to build the SVG structure and applies a `<mask>` with a `<circle>` to clip the lines. It generates one hundred horizontal and vertical `<rect>` elements, each ten pixels thick, with the horizontal band masked. The visual effect directly mimics LeWitt’s instructional art, translating his line-based system into an interactive browser window.

Rroyable88

85% match

Loading thumbnail…

LeWitt Reproduction vertical

This example reproduces a Sol LeWitt-inspired drawing by generating a grid of horizontal and vertical stripes that intersect across the full browser window. Two SVG masks create a central circular aperture: the first mask reveals the horizontal stripes inside the circle, while the second reveals vertical stripes outside it, producing a clean compositional contrast. The page builds the SVG programmatically using vanilla JavaScript and the DOM API, with no external libraries. The code sets element dimensions from `window.innerWidth` and `window.innerHeight`, ensuring the artwork adapts to the viewport.

Ggrassfluffy02

84% match

Loading thumbnail…

LeWitt Reproduction vertical

This example recreates a Sol LeWitt-inspired drawing using only SVG elements, producing a grid of alternating horizontal and vertical lines that intersect within two circular masks. The code generates 100 horizontal rectangles and 100 vertical rectangles, each 10 pixels thick, and uses two SVG masks—one with a white circle on black and another with a black circle on white—to reveal different line orientations in concentric regions. The visualization is built entirely with native DOM methods like `createElementNS` and `setAttribute`, without relying on D3.js, despite the accompanying `index.js` file importing `select` from D3.

Bbindas1

84% match

Loading thumbnail…

Sol LeWitt Reproduction vertical

This is a generative SVG reproduction of Sol LeWitt’s wall drawing, shown vertically across the full browser viewport. A circular mask, defined via SVG `<mask>` and a white circle, reveals only the central region of a grid of 100 horizontal and 100 vertical black rects. The horizontal rects are layered beneath the vertical ones and clipped by the mask, creating a contrasting circular window. The piece uses raw JavaScript DOM manipulation with `document.createElementNS` to build the SVG elements dynamically, with no external libraries.

Lliu yang

84% match

Loading thumbnail…

Sol LeWitt reproduction

This piece reproduces a Sol LeWitt wall drawing using JavaScript to generate SVG elements dynamically. It displays a composition of horizontal and vertical striped rectangles that form a distinct circular pattern at the center of the viewport. The rendering uses two SVG masks, `inner-circle-mask` and `outer-circle-mask`, to control the visibility of the 100 horizontal and 100 vertical `<rect>` elements, which are sized relative to the window’s dimensions. The code relies on basic SVG APIs such as `createElementNS`, `setAttribute`, and `appendChild` to construct the artwork.

AAngela Kochoska

84% match

Loading thumbnail…

Sol LeWitt Reproduction

This visualization uses raw SVG and JavaScript to reproduce a Sol LeWitt wall drawing. It layers 100 horizontal and 100 vertical rectangular stripes across the full browser window. A circular mask, created via SVG `mask` and `circle` elements, is applied only to the horizontal lines, revealing them solely within a central 200-pixel radius. The code dynamically sizes the artwork to the viewport dimensions, using `document.createElementNS` and `setAttribute` to build the composition without any external libraries.

EEdgar Cortez

84% match