Skip to main content
SimilarExport ZIP
100%

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

✓ Published1🌍 Public
CCasualWanderer20XX
Last edited Sep 9, 2025
Created on Sep 9, 2025

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.

AI-generated description
MIT Licensed

Similar vizzes

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

Sol LeWitt Attempt #3 Vanilla JS

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.

CCasualWanderer20XX
91% 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
Loading thumbnail…

Sol Lewitt Vanilla JS Project Attempt #2

This example generates an interactive Sol LeWitt-inspired drawing using only native JavaScript and SVG APIs, without external libraries. It shows a grid of thin horizontal and vertical lines across the full browser viewport, masked by two circles at the center. The first mask reveals horizontal bars within a dark circle, while the second mask inverts the effect for vertical bars in a contrasting ring, creating a crosshatched circular pattern that stands out against the plain background. The code creates elements dynamically via `document.createElementNS` and applies masks (`circle-mask`, `circle-mask-2`) to clip the repeated rectangles.

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

Sol LeWitt

This example generates a minimalist SVG composition inspired by Sol LeWitt, using intersecting horizontal and vertical bands clipped by triangular masks. It renders 99 horizontal and 99 vertical rectangles, each 10 pixels thick and spaced 20 pixels apart, creating a grid-like overlay. The code uses the SVG `mask` element and `polygon` shapes to define two complementary triangular regions, with horizontal strokes visible through one mask and vertical strokes through the other. The visualization is built entirely with vanilla JavaScript and the native SVG DOM API, requiring no external libraries.

AArturo Guevara
86% 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
86% match