Skip to main content
SimilarExport ZIP
100%

Fork of Sol LeWitt Reproduction

✓ Published0🌍 Public
Ssariyya-abdullayeva
Last edited Mar 13, 2023
Created on Mar 13, 2023

This example reproduces a Sol LeWitt art piece using raw SVG elements. It generates 100 vertical rectangles, each 10 pixels wide, that span the full height of the viewport. A circular mask, centered on the screen with a 200-pixel radius, limits the visible portion of these bars, creating a clean, geometric composition. The code uses the SVG `mask` element and dynamically creates rectangles and the circle via standard DOM APIs, with no external libraries or data sources.

AI-generated description

A reproduction of a Sol LeWitt art piece.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-inspired geometric composition using raw SVG. It shows a series of 100 horizontal bars, each 10 pixels tall and spaced 20 pixels apart, filling the entire window. A circular mask clips the bars so that only the area inside a centered circle of radius 200 pixels is visible, creating the artwork’s distinctive striped disc. The code creates SVG elements programmatically via the DOM API, using `createElementNS` and `setAttribute` to build the mask and rectangles without any external libraries.

SShahin Alam
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG and JavaScript, without any external libraries. It generates 100 horizontal and 100 vertical rectangles that intersect to form a grid across the entire viewport. Two SVG masks—a circular mask and an inverted circular mask—are applied to the rectangles, creating a sharp circular boundary with a single horizontal bar cutting through its center, while the surrounding area shows the full grid of vertical bars. The code uses `document.createElementNS` to build the SVG elements dynamically.

PPercivalnot
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG and JavaScript, with no external libraries. It shows a grid of horizontal and vertical bars that intersect within two circular masks, creating a geometric composition of alternating stripes and gaps. The code generates 100 horizontal rectangles across the full width and 100 vertical rectangles down the full height, each masked to reveal only the areas inside the circles. The masks are constructed with SVG `mask` elements, combining black and white rects and circles to control visibility, and the result is a clean, minimal visualization of layered line patterns.

BBharath Vijay
94% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using raw SVG. A circular mask reveals a set of horizontal, evenly spaced rectangles that span the full width of the viewport, creating a striped pattern confined to a central circle. The code constructs the SVG dynamically via the `document.createElementNS` API, setting the mask’s circle radius to 200 pixels and drawing 100 rectangles at 20-pixel intervals with 10-pixel heights. No external libraries are used; the rendering relies entirely on native browser SVG elements and attributes.

Mmatrice-one
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using raw SVG and JavaScript. It shows a grid of overlapping horizontal and vertical bands, where a circular area in the center is masked to reveal only the vertical lines, while the outer region displays only the horizontal ones. The code builds the SVG via `document.createElementNS`, creates two SVG `<mask>` elements with circle and rect primitives to control visibility, and renders 100 rectangles per axis. No external libraries are used; the rendering entirely relies on native browser SVG APIs.

PPurshotam Bohra
93% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using an SVG generated procedurally. It draws 100 horizontal and 100 vertical bars in a layered grid, with two circular masks controlling which parts of each set are visible. The first mask reveals the horizontal lines inside a central circle, while the second shows the vertical lines outside that same circle. The code builds the graphic with native SVG elements created via JavaScript and the DOM API, setting the mask attributes directly on each rectangle to create the overlapping visual effect.

RRogelio Díaz-Méndez
92% match
Loading thumbnail…

Fork of Sol LeWitt reproduction

This example reproduces the wall drawing style of Sol LeWitt using only SVG shapes and the native DOM API. It renders one hundred horizontal rectangles, each 10 pixels tall, evenly spaced down the screen, all clipped by a circular mask centered in the viewport. The page creates an SVG element dynamically, appends a mask with a white background and a black circle, then generates the rectangles in a loop without any external libraries. The result is a minimalist geometric pattern that highlights how simple SVG primitives can achieve a refined, artistic composition.

Aaidarshafeev1@gmail.com
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt artwork using procedural SVG rendering. It displays a grid of horizontal and vertical stripes that intersect within two circular masks, creating a geometric pattern where lines are visible only inside the circles. The code generates 100 rectangles in each direction, using SVG `mask` elements with `circle` shapes to constrain the drawn areas. A full-screen SVG canvas is built dynamically with `createElementNS`, and the composition is generated entirely through JavaScript without external libraries.

Eeverybitmihaly
92% match