Sol LeWitt Attempt #3 Vanilla JS

100%

Sol LeWitt Attempt #3 Vanilla JS

✓ Published1🌍 Public

Last edited Sep 9, 2025

Created on Sep 8, 2025

This example renders an abstract geometric composition inspired by Sol LeWitt’s wall drawings, built with vanilla JavaScript and the SVG API. It shows a 1000×700 canvas filled with alternating vertical and horizontal stripes that appear to weave through a central hourglass-like polygon shape. Two SVG masks define the visible regions: the first mask applies to 50 vertical red stripes, the second to 50 horizontal red stripes, creating a layered visual effect where the pattern changes orientation within the polygon. The code constructs the SVG elements dynamically using `createElementNS`, with mask polygons and stripe rectangles, demonstrating a low-level approach without external libraries.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Sol LeWitt Attempt #5 Vanilla JS

This example generates an abstract geometric composition inspired by Sol LeWitt, built with vanilla JavaScript and the SVG API. It uses two SVG masks to create a pattern of interlocking diamond shapes from a grid of polygons. Fifty vertical and fifty horizontal rectangles are drawn, each masked to reveal or hide portions of the grid, producing a layered, woven effect. The code demonstrates manual SVG element creation via `document.createElementNS`, with no external libraries.

CCasualWanderer20XX

93% match

Loading thumbnail…

Sol LeWitt Attempt #5 Vanilla JS (Pattern #1)

This example generates an SVG composition inspired by Sol LeWitt's geometric wall drawings, using two masks to create an intersecting grid of vertical and horizontal stripes. The code builds a hexagonal pattern with `document.createElementNS` for SVG elements, applying `mask-1` and `mask-2` to 50 vertical and 50 horizontal rectangles. The masks are constructed from repeated polygon coordinates, producing a checkerboard-like overlay of alternating shapes. No external libraries are used; the rendering relies entirely on vanilla JavaScript and SVG masks to achieve the Op Art effect.

CCasualWanderer20XX

91% match

Loading thumbnail…

Sol LeWitt Attempt #5 Vanilla JS (Pattern #2)

This example recreates a Sol LeWitt wall drawing using two layered masks to generate a grid of repeated geometric patterns. The SVG renders alternating vertical and horizontal stripes, where each stripe is clipped by a hexagon-based mask created with nested polygons. The code uses raw Document Object Model (DOM) methods like `document.createElementNS` to build the SVG structure, with no external libraries. The pattern emerges from the intersection of the two masks, producing a dynamic optical effect across the 1000 by 700 pixel canvas.

CCasualWanderer20XX

91% match

Loading thumbnail…

Sol Lewitt in Vanilla JS Project Attempt #1

This example recreates a Sol Lewitt-inspired geometric drawing using nested, alternating black-and-white rectangles that shrink toward the center of an SVG canvas. The work is generated entirely with vanilla JavaScript, manipulating SVG elements through the Document Object Model (DOM) and the `createElementNS` API. It renders a grid of concentric rectangles with varying stroke widths and fill colors, producing a static, pattern-based composition. The code uses raw SVG string concatenation within a loop to build the shapes, with no external libraries or data sources involved.

CCasualWanderer20XX

88% match

Loading thumbnail…

Sol LeWitt Vanilla JavaScript

This example reproduces a Sol LeWitt wall drawing using only Vanilla JavaScript and the SVG API. It constructs an SVG scene with a white rectangle and a black circle defined as a mask, then renders 100 horizontal stripes as individual SVG `<rect>` elements. Each rectangle’s visibility is filtered through the circular mask, creating the artwork’s characteristic banded composition within a circular boundary. The code dynamically sets the canvas to the browser’s full window dimensions and uses no external libraries or data sources.

Ppeter@attachmentdivision.com

88% match

Loading thumbnail…

Sol LeWitt in Vanilla JavaScript (2)

This example reproduces a Sol LeWitt art piece using only vanilla JavaScript and the SVG API. It shows a grid of black vertical and horizontal rectangles intersecting within a central white area, created through layered masking. The code builds an SVG mask with a large white rectangle and a smaller black rectangle to hide portions of the vertical stripes, while a foreground mask with a white center reveals the horizontal stripes within the same central region. The rendering approach relies on programmatic SVG element creation and mask compositing.

Xxinyuwangxyw

88% match

Loading thumbnail…

Sol LeWitt in Vanilla JavaScript

This example recreates a Sol LeWitt wall drawing using only Vanilla JavaScript and the SVG API, with no external libraries. The SVG dynamically adapts to the browser window’s dimensions, generating a composition of alternating horizontal and vertical bars. It uses SVG `<mask>` elements with circles to clip the bar patterns, revealing a circular region in the center where the orientation of the lines shifts, mimicking the geometric interplay found in LeWitt’s conceptual art. The code builds all shapes procedurally via `createElementNS`.

Xxinyuwangxyw

87% match

Loading thumbnail…

Sol LeWitt Exercise with JS

An SVG built with vanilla JavaScript recreates a Sol LeWitt-inspired wall drawing by layering two sets of 100 striped rectangles. Horizontal and vertical black bars cross the full viewport, but a pair of circular masks restricts visibility: one mask shows only the horizontal stripes inside a 200-pixel circle, while the second reveals vertical stripes outside that same radius. The result is a clean, conceptual grid where the two orientations visually swap at the circle's boundary, using the SVG `mask` element and dynamic element creation via `document.createElementNS`.

Ppkdvalis

87% match