Skip to main content
SimilarExport ZIP
100%

Sol Lewitt Reproduction - SVG

✓ Published1🌍 Public
AAdil Zeshan
Last edited Apr 4, 2021
Created on Apr 2, 2021

This example reproduces a Sol Lewitt conceptual drawing using only SVG and JavaScript. It renders two sets of horizontal and vertical striped rectangles that are masked to reveal a central circle, with each line pattern clipped differently to create the interplay of shapes. The code dynamically generates SVG elements via the DOM API, using masks and circles to control visibility, and adapts the artwork to the full browser window dimensions.

AI-generated description

A reproduction of one of Sol Lewitt's conceptual artistic pieces.

MIT Licensed

Similar vizzes

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

Sol Lewitt Reproduction javascript in html

This example reproduces a Sol LeWitt wall drawing using JavaScript and dynamically generated SVG. It shows a grid of horizontal and vertical stripes, with a circular area in the center where the pattern is inverted due to two overlapping SVG masks. The code creates the SVG namespace via `document.createElementNS` and builds the composition procedurally. The first mask hides the vertical lines within a 200-pixel radius circle, while the second mask hides the horizontal lines in that same region. The rendering relies entirely on core SVG and JavaScript APIs, with no external libraries.

GGullyPlook
92% match
Loading thumbnail…

Sol lewitt reproduction

This example reproduces a Sol LeWitt wall drawing using layered SVG masks and repeated geometric stripes. The viewport is split into quadrants where horizontal black bars fill a large circular mask, vertical bars occupy two white quadrants around a smaller inner circle, and diagonal lines (incomplete in the code) would structure the remaining spaces. Rendered entirely with vanilla JavaScript and the SVG DOM API, it creates the illusion of intersecting line patterns within nested circular and rectangular boundaries. The approach relies on programmatic construction of SVG elements, with masks defining visible regions for each stripe direction, mimicking LeWitt’s algorithmic instructions.

Ssheldonv2.0@gmail.com
91% match
Loading thumbnail…

Sol Lewitt Reproduction SVG

This example reproduces a Sol LeWitt-style geometric drawing using SVG, showing a grid of horizontal and vertical stripes that are masked to reveal a central circle. The visualization dynamically fills the browser window by setting the SVG width and height to the viewport dimensions. It constructs two SVG masks with white and black circles and rectangles, then renders 100 horizontal and 100 vertical stripe rectangles, each referencing a mask to clip the pattern. The code uses the DOM API `document.createElementNS` to build SVG elements programmatically with JavaScript.

Mmaximus2581
91% 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
90% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using dynamically generated SVG elements. It shows a grid of horizontal and vertical stripes, masked to reveal a central circular area where only horizontal lines appear, surrounded by vertical lines. The code uses raw Document Object Model (DOM) methods such as `document.createElementNS` and `setAttribute` to construct the SVG, with two mask definitions (`circle-mask` and `circle-mask-2`) controlling visibility. No external libraries are used; the rendering relies purely on SVG rectangles and masks in the browser.

PPareel Amre
90% 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 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
90% match