Fork of Fork of Sol Lewitt Reproduction mask inverse

100%

Fork of Fork of Sol Lewitt Reproduction mask inverse

✓ Published1🌍 Public

Last edited Aug 8, 2022

Created on Aug 8, 2022

Forked from Fork of Sol Lewitt Reproduction mask

This visualization reproduces a Sol Lewitt art piece by layering black horizontal and vertical lines on a full-screen SVG. A circular mask, created with SVG `<mask>`, `rect`, and `circle` elements, reveals only the intersection area, inverting the mask to isolate the converging lines. The code uses plain JavaScript DOM manipulation to generate 100 horizontal and 100 vertical bars, with the mask inverted to show the pattern only inside the circle. No external libraries are used; rendering relies on native SVG attributes and inline styling.

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

This visualization reproduces a Sol LeWitt art piece by drawing vertical and horizontal striped rectangles that are clipped by two circular masks, creating a circular intersection of alternating line directions. The vertical stripes are masked in one circle while horizontal stripes use an inverted mask, resulting in a striking contrast between the two orientations. Built with plain SVG and JavaScript, the code creates mask elements and rects dynamically, with redundant masked stripes generated but not appended, leaving the final composition to render only the active circle-based overlay.

Aanakin13

90% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using an SVG rendering approach. It displays a grid of horizontal and vertical lines that intersect within two circular masks, creating a nested geometric pattern centered on the screen. The code constructs SVG elements dynamically via the Document API, using `createElementNS` to build rectangles and circles. Two masks (`circle-mask` and `circle-mask-2`) control visibility: the first reveals horizontal stripes inside a 200-pixel-radius circle, while the second exposes vertical stripes in the surrounding area, producing a layered, minimalist composition.

NNeel Mehta

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

90% match

Loading thumbnail…

Fork of Fork of Fork Sol LeWitt Reproduction Mask Inverse

A grid of horizontal and vertical SVG rectangles fills the screen, but two circular masks invert their visibility. A white circle in a black mask reveals a central block of horizontal lines, while a black circle in a white mask hides the same area from vertical lines. This creates a cross-hatched pattern with an empty circular void at the center. The code uses d3 selections, data joins, and SVG mask elements.

Rroyable88

90% match

Loading thumbnail…

Fork of Sol Lewitt Reproduction mask

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.

Kkwambokar

90% match

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

90% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece as an interactive SVG composition. It shows a circular mask revealing horizontal and vertical striped bands, while a second inverted mask exposes the same structure in negative space. The code uses raw SVG APIs to create masks, rectangles, and circles without external libraries, generating 200 striped rectangles dynamically via nested loops. The rendering approach relies on SVG mask elements to layer and alternate visibility across the full viewport.

VVlad Tukhtarov

90% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction observation

This visualization reproduces a Sol LeWitt art piece, displaying a grid of thin horizontal and vertical lines that intersect only within a central circular region. The code creates an SVG canvas and uses two SVG masks (`circle-mask` and `circle-mask-2`) with inverted fills to control which rectangles are visible. One set of 100 horizontal strips is clipped by a white circle on a black mask, while another set of 100 vertical strips is clipped by a black circle on a white mask, producing a layered crosshatch effect inside the circle. The full-window black and white rectangles are rendered in plain HTML5 SVG without any external libraries.

SSailendri

89% match