sol_lewitt_test2

100%

sol_lewitt_test2

✓ Published1🌍 Public

Last edited Oct 31, 2022

Created on Oct 30, 2022

This visualization creates a dynamic, grid-based composition inspired by Sol LeWitt’s geometric art. It uses SVG masks to alternate which quadrants show vertical or horizontal lines, while the `animate` API pulses the line widths over a five-second loop. The code constructs all elements programmatically with raw SVG namespace methods, producing a subtly shifting checkerboard pattern of animated stripes.

AI-generated description

A demonstration of SVG shapes.

MIT Licensed

Similar vizzes

Loading thumbnail…

sol_lewitt_test

This example generates a procedural drawing of vertical and horizontal hairlines, creating a grid-like pattern. The code uses a mask to hide the horizontal lines outside a central circle, while vertical lines are masked by the inverse shape, producing a dynamic interplay of intersecting strokes. The result is a derivative of Sol LeWitt’s generative art aesthetic. The drawing is created entirely with SVG elements, using JavaScript to append rectangles and mask definitions to the document.

Ggaudi84

84% match

Loading thumbnail…

Reproduction Sol Lewitt Horizontal

This example reproduces Sol LeWitt’s horizontal wall drawing using animated SVG masks to create a shifting circular aperture over a grid of horizontal and vertical lines. The visualization shows a pulsing black-and-white circle that expands and contracts, revealing and hiding the underlying striped composition as the masks animate. Built entirely with raw SVG elements and the Web Animations API via `animate` and `animateTransform`, the code generates 950-pixel-wide rectangles and vertical strips, applying `mask` and `mask2` to alternate visibility. The circular mask radius animates over five seconds, while a separate rotation transform spins the vertical lines, mimicking LeWitt’s geometric rules.

KKhanAzmat

83% match

Loading thumbnail…

Animated Sol LeWitt reproduction

This animated SVG reproduces the geometric style of artist Sol LeWitt using strips of vertical rectangles. Two circular masks, one inverted, move diagonally across the canvas while their radii pulse between 200 and 100 pixels. The animation is created entirely with native SVG elements, including `<mask>`, `<circle>`, and `<animate>` tags, which drive the motion of the mask centers along viewport-perimeter paths. The code constructs roughly one hundred rectangular bars via a repeated loop, with each rect filtered through the masks to reveal shifting patterned compositions.

HHtet Yan Oo

83% match

Loading thumbnail…

Sol Lewitt

This generative visualization creates a geometric pattern inspired by Sol LeWitt’s wall drawings, using only SVG and JavaScript without external libraries. It overlays two sets of 100 rectangular stripes—vertical and horizontal—onto a full-screen canvas. A circular mask isolates a centered ring where horizontal stripes are inverted, while a second mask carves a solid white circle ring from the vertical stripes. The result is a repeating grid whose central region shifts contrast, producing an optical interplay of lines and negative space.

Kkrunalpalande

83% 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

83% match

Loading thumbnail…

Sol Lewitt in Vanilla JS

This piece reproduces a Sol Lewitt art concept using a generative, animated SVG composition. It displays a rotating triangular mask that reveals or conceals a grid of horizontal and vertical lines, creating a dynamic interplay of shapes. Rendered entirely in vanilla JavaScript, the code dynamically creates SVG elements via `createElementNS`, building a responsive full-window graphic. The animation is driven by CSS keyframes, while two distinct SVG masks, one inverting the other, control the visibility of the line grid, producing a clean, geometric visual effect.

JJaga-droid

82% 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

82% match

Loading thumbnail…

My Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt wall drawing using only raw JavaScript and the SVG API. It shows a grid of alternating horizontal and vertical stripes masked into two triangular shapes, creating a geometric interplay of line and form. The code builds an SVG canvas, defines two circle masks containing white and black triangles, and then appends 50 horizontal and vertical rectangle strips. These strips use the masks to reveal the triangular compositions, directly mimicking LeWitt’s instruction-based art without any external libraries.

Aaryan0821

82% match