Skip to main content
SimilarExport ZIP
100%

Sol Lewis

✓ Published1🌍 Public
JJunaid Ahmed Jameel
Last edited Jan 4, 2024
Created on Jan 3, 2024
Forked from Hello HTML

This example reproduces a Sol LeWitt wall drawing using overlapping horizontal and vertical bands that intersect only within a centered circular region. Created with raw SVG and JavaScript, the piece renders 100 horizontal strips and 100 vertical strips, each clipped by one of two complementary circular masks to create a checkerboard-like interplay inside the circle while remaining solid outside. The code constructs the SVG elements dynamically using `document.createElementNS` and applies mask effects via `url(#circle-mask)` references, producing a geometric, generative composition without external libraries.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

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

Sol LeWitt

This visualization recreates Sol LeWitt’s geometric wall drawings using overlapping horizontal and vertical striped bands. A central circular mask reveals the intersection of both patterns, while the surrounding areas remain blank. The code builds SVG elements manually with `createElementNS`, applying two separate circle-based masks to clip groups of thin rectangles. No external libraries are used; rendering relies entirely on raw SVG masks and rect primitives at a fixed 100-line count per direction.

Ddanheavern
89% match
Loading thumbnail…

Sol LeWitt Reproduction Final

This example reproduces a Sol LeWitt wall drawing using pure JavaScript and SVG APIs. It shows a grid of horizontal and vertical striped rectangles overlaid with two circular masks, creating a composition of intersecting lines that fade into a central circle. The code builds SVG elements dynamically via `document.createElementNS`, applying a black-to-white mask and an inverted white-to-black mask to reveal alternating line directions. One hundred horizontal strips and one hundred vertical strips are generated in loops, with the masks controlling visibility to form the final geometric pattern.

AAndre J Denais
88% match
Loading thumbnail…

Sol Lewitt Reproduction

This example reproduces a Sol LeWitt-style drawing using SVG and JavaScript. It displays a grid of vertical and horizontal stripes that are visible only within a central circle, creating an intersection pattern. The code uses the Document Object Model (DOM) to create SVG elements, including masks, rectangles, and circles. Two circular masks with contrasting fills control where each set of stripes is revealed, demonstrating a generative art technique with a clean, geometric output.

VVincent Leduc
88% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using SVG and JavaScript. A circular mask isolates a group of horizontal stripes, while un-masked vertical lines extend across the full canvas. The code generates 100 horizontal rectangles with a set height and 100 vertical rectangles, positioning them in a grid pattern via the `createElementNS` API. The mask, defined with a `circle` element, limits the horizontal stripes to a central circular region, creating a subtle intersection effect between the two sets of lines.

AArnulfotos
88% match
Loading thumbnail…

Sol LeWitt

This example reproduces Sol LeWitt’s geometric art using an SVG rendering approach. It displays a grid of horizontal and vertical stripes, but only within a circular region at the center of the screen. The code creates SVG masks, specifically `circle-mask` and `circle-mask2`, to clip two sets of 100 rectangle elements. The first set uses a white-on-black mask for horizontal stripes, while the second uses a black-on-white mask for vertical stripes, producing a clean, intersecting pattern. The canvas automatically scales to the full window dimensions.

Aamrselaraby
88% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using two overlapping masks to create a circular interplay of horizontal and vertical stripes. The SVG canvas displays 100 horizontal bands and 100 vertical bands, each masked to reveal a clear circle in the center. The code constructs SVG elements programmatically, using `createElementNS` for the `rect` and `mask` nodes, and applies the masks via `url(#circle-mask)` and `url(#circle-mask-2)`. The piece demonstrates geometric abstraction through simple, repeating shapes and clipping.

CCurran Kelleher
87% match
Loading thumbnail…

Sol Lewitt diagram

This example recreates Sol LeWitt’s geometric wall drawing using two sets of overlapping horizontal and vertical SVG rectangles. A circular mask isolates the central intersection, while a second inverted mask reveals the surrounding grid, producing a cross-shaped composition. The code generates 100 rectangles in each direction via the SVG DOM API, setting their masked attributes to create the visual interplay. Rendered in pure JavaScript with `document.createElementNS`, the artwork adapts to the full browser window size.

TTirth Trivedi
87% match