Alternate Sol LeWitt

100%

Alternate Sol LeWitt

✓ Published0🌍 Public

Last edited Apr 3, 2025

Created on Apr 3, 2025

The visualization creates an alternating pattern of horizontal and vertical lines that intersect to form a heart shape. It uses raw SVG elements—rectangles and masks—to manage the display, with the heart mask cutting a shape into the line fields. The code directly manipulates the DOM using JavaScript, setting attributes on `rect` and `mask` elements, with commented-out sections referencing alternative masking approaches. The lines are generated programmatically in a loop, and the entire composition is responsive to the browser window dimensions.

AI-generated description

MIT Licensed

Similar vizzes

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

82% match

Loading thumbnail…

Sol Lewitt

This example visualizes a grid of horizontal and vertical lines composed with a circular mask, creating an interwoven geometric pattern reminiscent of Sol LeWitt’s minimalist drawings. The code uses native SVG elements—`rect`, `mask`, and `circle`—to control which regions of the line grid remain visible, with two complementary masks revealing intersecting bands around the center. All shapes are generated programmatically via a loop, with the window dimensions set dynamically. This work demonstrates how simple SVG masking techniques can produce complex, aesthetically striking compositions.

Aashutoshc018@gmail.com

82% match

Loading thumbnail…

Fork of Sol LeWitt

A fork of Sol LeWitt generates a grid-based geometric pattern where horizontal and vertical lines intersect within a circular mask, with a rotating heart shape embedded at the center. The SVG rendering uses custom masks to selectively reveal or hide line clusters, and CSS keyframe animations drive the heart's rotation. Lines are drawn as 10-pixel-wide rectangles, and the entire composition fills the browser window via dynamically set width and height attributes.

CCora

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

81% match

Loading thumbnail…

Animation of Sol LeWitt

This example creates an abstract, animated SVG composition inspired by Sol LeWitt. It uses a full-window SVG canvas and draws a complex, irregular shape defined by an SVG path. The path is used in two separate mask elements, each controlling the visibility of a set of horizontal and vertical lines. By using these masks, the geometric line pattern is revealed only within the shape's boundaries, creating a dynamic interplay between form and structure. The code directly manipulates the SVG DOM through JavaScript and the `createElementNS` API.

CCora

80% match

Loading thumbnail…

Sol Le Witt Vertical

This example generates an abstract, Sol LeWitt-inspired visual composition using only SVG and JavaScript. It creates two circular masks via the SVG `mask` element, and draws a grid of horizontal and vertical rectangles that are selectively revealed through each mask. The first mask shows a series of horizontal lines inside a black circle, while the second shows vertical lines outside a white circle, creating a layered, geometric contrast. The code dynamically creates SVG elements using `document.createElementNS` and appends them to the document, with dimensions tied to the full window size.

SShannon Teoh

80% match

Loading thumbnail…

Sol lewitt vertical variant

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.

Iibaird6@gatech.edu

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

80% match