Skip to main content
SimilarExport ZIP
100%

Fork of Joe LeWitt Reproduction

✓ Published1🌍 Public
Ccssergio
Last edited May 22, 2022
Created on May 22, 2022

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.

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

Fork of Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-inspired geometric composition using raw SVG. It shows a series of 100 horizontal bars, each 10 pixels tall and spaced 20 pixels apart, filling the entire window. A circular mask clips the bars so that only the area inside a centered circle of radius 200 pixels is visible, creating the artwork’s distinctive striped disc. The code creates SVG elements programmatically via the DOM API, using `createElementNS` and `setAttribute` to build the mask and rectangles without any external libraries.

SShahin Alam
87% match
Loading thumbnail…

Joe LeWitt Reproduction Vertical

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.

Ccssergio
86% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction-

A generative SVG artwork reproduces a Sol LeWitt piece by filling a central circular mask with 100 horizontal bars. Two SVG mask elements define the visible circle and a second matching circle used as a cutout. The page constructs each bar as a `rect` element via the browser's `document.createElementNS` API, applying `url(#circle-mask)` to clip the stripes. Bars are evenly spaced at 20-pixel intervals, with a 10-pixel height, against a full-window black background, directly implementing the geometric composition in plain JavaScript and SVG, with no external libraries.

Kkoslin
86% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG elements. It generates 100 vertical rectangles, each 10 pixels wide, that span the full height of the viewport. A circular mask, centered on the screen with a 200-pixel radius, limits the visible portion of these bars, creating a clean, geometric composition. The code uses the SVG `mask` element and dynamically creates rectangles and the circle via standard DOM APIs, with no external libraries or data sources.

Ssariyya-abdullayeva
86% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using an SVG generated procedurally. It draws 100 horizontal and 100 vertical bars in a layered grid, with two circular masks controlling which parts of each set are visible. The first mask reveals the horizontal lines inside a central circle, while the second shows the vertical lines outside that same circle. The code builds the graphic with native SVG elements created via JavaScript and the DOM API, setting the mask attributes directly on each rectangle to create the overlapping visual effect.

RRogelio Díaz-Méndez
86% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing by generating a grid-like pattern of horizontal and vertical bars on an HTML5 SVG canvas. It uses SVG masks to create a central circular window: one mask hides everything except a 200-pixel-radius circle, while a second mask inverts that region. The code dynamically creates 100 horizontal and 100 vertical rectangles, each layered with alternating masks to produce the distinctive visual effect. The piece adapts to the browser’s full window dimensions, demonstrating algorithmic art generation through direct DOM manipulation and SVG APIs without external libraries.

LLiam Connors
86% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece by drawing a grid of horizontal and vertical bars overlaid on a circle. It shows a geometric composition where a central circular area is filled with alternating stripes, created by masking a series of thin rectangles. The code uses the SVG API to construct elements, defining two masks (circle-mask and circle-mask-2) to control which bars are visible. The bars are generated by looping through 100 iterations, placing either horizontal strips with varying y-offsets or vertical strips with varying x-offsets, with the circle’s radius determined by the window dimensions.

Jjsoudeer
86% match