Skip to main content
SimilarExport ZIP
100%

Sol lewitt vertical variant

✓ Published1🌍 Public
Iibaird6@gatech.edu
Last edited Sep 11, 2025
Created on Sep 11, 2025

This example renders a generative, minimalist composition inspired by Sol LeWitt. It displays a lattice of vertical and horizontal strips on a full-window SVG canvas, with the pattern revealed only inside a circular region at the center. The code builds the artwork by appending SVG `rect` elements and applies a circular mask using a dedicated SVG `mask` element. The visualization uses raw JavaScript and the DOM API to construct the SVG elements directly.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Sol Lewitt Reproduction Vertical

This example reproduces a Sol LeWitt-style drawing as a vertical sequence of horizontal stripes, clipped by a circular mask centered on the screen. It shows how generative geometry can create a minimalist composition directly in the browser. The code uses raw SVG APIs via `document.createElementNS` and `setAttribute` to construct 100 rectangles, each 10 pixels tall, spanning the full viewport width. A `mask` element with a white circle limits visibility, while the page fills the entire window with no margins or scrolling. The rendering approach is entirely procedural, using only vanilla JavaScript and SVG without external libraries.

Eelgato_1994
89% match
Loading thumbnail…

Sol LeWitt Vertical Variant

A generative art reproduction of a Sol LeWitt piece creates a vertical grid of horizontal and vertical bars. A circular mask, defined using raw SVG elements, limits the visibility of the horizontal bars to a central disc. The code builds the SVG document and its elements directly via the DOM API in vanilla JavaScript, using `document.createElementNS` and `setAttribute`. The composition shows structured, rule-based line work that contrasts the masked circle with the surrounding rectangular bands.

Ttriciascully
89% match
Loading thumbnail…

Sol LeWitt

This example renders a generative composition inspired by Sol LeWitt using raw SVG creation via JavaScript. It constructs a full-screen SVG and uses two masks to create a circular cutout: one mask reveals vertical stripes outside the circle, while another reveals horizontal stripes inside it. The code manually creates SVG elements using the `document.createElementNS` API and sets attributes directly, without using any external libraries. The result is a static, geometric pattern of 100 vertical and 100 horizontal rectangular stripes that alternate based on their position relative to the central circle.

JJamie
89% match
Loading thumbnail…

Sol_LeWitt_Vertical Variant

This example recreates a Sol LeWitt-style wall drawing as a full-screen SVG composition. It layers a grid of horizontal and vertical stripes, with a circular white mask revealing only the horizontal lines within a 200-pixel-radius circle centered on the viewport. The code builds the SVG and mask elements dynamically via the Document Object Model API, using `document.createElementNS` and `setAttribute` to generate 100 rectangles in each direction. No external libraries are used; the rendering relies entirely on native SVG mask and rectangle primitives.

Rraturi22@gmail.com
88% match
Loading thumbnail…

Sol Lewitt

A generative art visualization recreates Sol LeWitt’s geometric style by layering 100 horizontal and 100 vertical striped rectangles over the full viewport. Two SVG masks combine to create a central circular window: the horizontal stripes are visible inside a white circle, while the vertical stripes appear outside it. The code builds the SVG programmatically using standard DOM APIs such as `createElementNS` and `setAttribute`, with masks (`mask`, `mask2`) controlling the blend of the two line grids.

Aadonisacruz0@gmail.com
88% match
Loading thumbnail…

Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-inspired wall drawing using raw SVG and JavaScript. It presents a grid of horizontal and vertical stripes that intersect through two circular masks, creating a layered composition with a central white circular void and a black circular overlay. The code constructs SVG elements directly via the DOM API, including `rect` shapes and two custom `<mask>` definitions, to alternate stripe visibility. A total of 200 rectangles are generated programmatically, with no external libraries or frameworks, relying solely on browser-native SVG rendering to achieve the geometric effect.

GGbemiga Atolagbe
88% 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
88% match
Loading thumbnail…

Sol Lewitt Variante

This example recreates a Sol LeWitt-inspired wall drawing as an interactive SVG visualization. The artwork shows a grid of thin horizontal and vertical lines that are visible only within two overlapping circular masks, creating a crosshatched pattern inside the circles against a blank background. The code uses plain JavaScript with the SVG DOM API, creating mask elements and hundreds of rect primitives programmatically. A black-filled mask with a white circle reveals the horizontal lines, while an inverted mask with a black circle reveals the vertical lines, demonstrating a simple yet effective clipping technique.

Iibaird6@gatech.edu
88% match