Skip to main content
SimilarExport ZIP
100%

Fork of Sol Lewitt Reproduction mask

✓ Published1🌍 Public
Kkwambokar
Last edited Aug 8, 2022
Created on Aug 8, 2022

This example reproduces a Sol LeWitt-inspired geometric composition by drawing 100 horizontal stripes across the full browser window. A circular SVG mask, defined with a black circle over a white rectangle, reveals only the central region of the stripes, creating a circular vignette effect. The code constructs all elements dynamically using the raw Document Object Model (DOM) API, including `document.createElementNS` and `setAttribute`, without relying on external libraries. The mask and rectangles are appended directly to an SVG element sized to match the viewport dimensions.

AI-generated description

A reproduction of a [Sol Lewitt art piece] (https://www.edfu2.com/sol-lewitt-a-life-of-ideas-book-review-2/).

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sol LeWitt Reproduction Mask

A fork of Sol LeWitt’s geometric art, this visualization renders a series of horizontal black stripes across the full browser window, with a circular region in the center masked out to reveal the white background. The composition uses an SVG `mask` element to create the circle, while JavaScript dynamically generates 100 rectangles, each 10 pixels tall, and applies the mask to them. The code relies on native SVG APIs, including `createElementNS` and `setAttribute`, without any external libraries.

CCurran Kelleher
94% match
Loading thumbnail…

Fork of Sol LeWitt reproduction Mask

This example reproduces a Sol LeWitt art piece as an interactive SVG visualization. It shows a field of vertical rectangular stripes that are fully visible outside a central circular area, where they are masked out to reveal a blank region. The code uses raw JavaScript and DOM manipulation to construct an SVG `mask` element containing a white background rectangle and a black circle, then applies that mask to 100 overlapping vertical rectangles via the `url(#circle-mask)` reference. The rendering approach is purely procedural, generating shapes directly with `document.createElementNS` without any external data or libraries.

ZzolboBatsaikhan
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction Mask

This example uses SVG masking to reproduce a Sol LeWitt-inspired geometric composition. It draws 100 horizontal rectangles across the full viewport width, each masked by a single black circle centered on the screen. The mask, defined with the SVG `mask` element and a `rect` plus `circle`, reveals the stripes only within the circular area, creating a clean cutout effect. The code builds the visualization imperatively via `document.createElementNS`, with no external libraries, and responds to the window’s dimensions for full-screen display.

MMinchan Jun
92% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-style drawing using raw SVG elements and mask manipulation. The visualization renders a series of overlapping horizontal and vertical stripes by creating rectangles and applying circular SVG masks to confine their visibility, producing a geometric composition. The code uses DOM manipulation via `createElementNS` and `setAttribute` to construct the SVG, with two distinct masks (`circle-mask` and `circle-mask-2`) controlling different stripe patterns. The result is a monochromatic, grid-based artwork where varying rectangle heights and widths generate a rhythmic, minimalist pattern across the full viewport.

NNeel Mehta
92% 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
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This fork of a Sol LeWitt reproduction renders a minimalist geometric composition using raw SVG and the DOM API. It shows a circular mask centered on the viewport, with a white outer ring and black inner circle, through which 100 horizontal striped rectangles are displayed. Each rectangle is created with `document.createElementNS`, assigned a fixed height and y-position, and clipped using an SVG `mask` element. The piece relies entirely on JavaScript and SVG primitives rather than any external libraries or datasets.

Zzaioris
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece using only JavaScript and the SVG API. A central circular mask reveals a grid of horizontal black lines in the center of the viewport, while a second inverted mask allows vertical black lines to appear only outside the same circle, creating a striking contrast. The code dynamically creates all SVG elements—including masks, rectangles, and circles—based on the browser window dimensions, generating 100 horizontal and 100 vertical stripes that intersect in a pattern defined by the two masks.

Mmagswo
91% match
Loading thumbnail…

Fork of Sol LeWitt Reproduction

This fork of a Sol LeWitt reproduction generates an abstract, grid-based composition entirely with SVG elements. It shows a central circular mask that reveals alternating horizontal and vertical stripes across the full screen. The code creates two masks—one with a black background and white circle, another with a white background and black circle—to control which stripes are visible. It uses the raw SVG DOM API via `document.createElementNS` to draw 100 horizontal rectangles and 100 vertical rectangles, each 10 pixels thick, with the masks applied to create the overlapping circle effect. No external libraries are used; only native JavaScript and SVG.

KKusumaKumariDama@my.unt.edu
91% match