Sol LeWitt

100%

✓ Published0🌍 Public

Last edited Sep 29, 2023

Created on Sep 29, 2023

This example reproduces a Sol LeWitt-inspired geometric drawing using SVG. A series of 100 horizontal rectangles, each 10 pixels tall and spaced 20 pixels apart, render across the full screen width. A circular mask centered on the viewport clips these rectangles, revealing only the lines inside the circle. The visualization uses plain JavaScript to create SVG elements dynamically, with no external libraries, and responds to the browser window’s dimensions for sizing.

AI-generated description

a reproduction of a [sol lewitt art piece](put url here)

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol Lewitt picture

This example reproduces a Sol LeWitt-inspired geometric composition using raw SVG. The visualization shows a series of one hundred vertical rectangles evenly spaced across the full width of the browser window, each with a fixed width of 10 pixels and extending the entire height of the viewport. The code generates the SVG elements directly via the Document Object Model (DOM) API, using `document.createElementNS` and `setAttribute` to position and size each rectangle. The rendering relies on the browser’s native SVG support, with no external libraries or data sources involved.

FFrancisco Ibelles

91% match

Loading thumbnail…

Sol Lewitt Reproduction

This example reproduces a Sol LeWitt wall drawing as an interactive SVG visualization. It renders 100 vertical rectangles, each 10 pixels wide, evenly spaced across the full viewport height. The code uses the SVG API to create and append each rectangle dynamically via `document.createElementNS`. All shapes are generated procedurally without an external dataset, directly mimicking LeWitt’s geometric style. The result is a minimalist, full-screen composition that fills the browser window.

KKathleen Johnston

91% match

Loading thumbnail…

Sol LeWitt

This example reproduces a Sol LeWitt drawing using SVG. It renders a grid of horizontal and vertical stripes, with a circular mask creating the illusion of layered bands across the canvas. The stripes are generated programmatically in JavaScript, using `document.createElementNS` to build SVG `rect` elements. Two complementary masks (`circle-mask` and `circle-mask-2`) alternate which stripe orientation is visible, producing a clean geometric composition that adapts to the full browser window size.

Aainhoadieruiz@gmail.com

90% match

Loading thumbnail…

Sol Lewitt Reproduction Vertical

This visualization reproduces a Sol Lewitt art piece using only SVG elements. It draws 100 horizontal black rectangles, each 10 pixels tall and spaced 20 pixels apart, across the full width of the viewport. A circular mask (created with SVG `mask` and `circle` elements) is centered on the screen, clipping the rectangles so they are only visible within a round opening. The rendering is driven entirely by the Document Object Model (DOM) API, using `document.createElementNS` to generate raw SVG without any external libraries.

Kkwambokar

90% match

Loading thumbnail…

Sol Lewitt

This example renders a full-screen SVG composed of one hundred vertical rectangles, each ten pixels wide, spaced twenty pixels apart. The rectangles are created programmatically using the native Document Object Model API, with `document.createElementNS` and `setAttribute` to construct each SVG `rect` element. The `window.innerWidth` and `window.innerHeight` properties define the canvas dimensions, while the fixed loop count determines the layout. The result is a minimalist, grid-like pattern inspired by Sol LeWitt’s geometric wall drawings, though no data source or interaction drives the composition.

BBaptPoi

90% match

Loading thumbnail…

TD_Sol_Lewitt

This example reproduces a Sol LeWitt-inspired drawing using raw SVG and JavaScript, without any external libraries. It renders 100 vertical rectangles, each 10 pixels wide, spaced 20 pixels apart, and filling the full height of the browser window. The rectangles are created dynamically in a loop using the `document.createElementNS` API and appended to an SVG element whose dimensions match `window.innerWidth` and `window.innerHeight`. The resulting pattern demonstrates a minimalist, systematic grid-based composition directly in the browser.

TTatjana Dzambazova

90% match

Loading thumbnail…

Sol LeWitt

This example renders a generative SVG artwork inspired by Sol LeWitt. It uses raw JavaScript to create an SVG element sized to the browser window, then draws 100 vertical rectangles, each 10 pixels wide and spaced 20 pixels apart, spanning the full height of the canvas. A circular mask, defined in SVG and applied via the `mask` attribute, clips these rectangles, revealing a bold, striped disk centered on the screen. The piece demonstrates programmatic shape creation and SVG masking without any external libraries.

Bbillzhou2005

89% match

Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-style geometric piece using only SVG and JavaScript, creating an intricate grid of horizontal and vertical lines. It shows a large circular mask revealing a woven pattern of alternating line directions, with the circle centered on a full-screen canvas. The code builds the visualization by constructing SVG elements via the DOM API (`document.createElementNS`), defining two masks (`circle-mask` and `circle-mask-2`) to clip horizontal and vertical line groups. It generates 100 horizontal rectangles and 100 vertical rectangles, each 10 pixels thick, with the masks controlling visibility to create the overlapping effect. No external libraries are used; the rendering relies purely on raw SVG and JavaScript.

IIndranil Biswas

89% match