Fork of Frank Stella Reproduction

100%

Fork of Frank Stella Reproduction

✓ Published0🌍 Public

Last edited Mar 4, 2024

Created on Mar 4, 2024

This example reproduces Frank Stella’s geometric abstraction using an SVG mask technique. Two layered masks create intersecting triangular cutouts, revealing alternating red and yellow horizontal and vertical striped rectangles. The code builds the SVG dynamically with `createElementNS`, applies masks via a white/black fill pattern, and uses the Share Tech font for any text. No external data is used; the artwork is generated procedurally from viewport dimensions and fixed loop counts.

AI-generated description

A reproduction of Sol DeWitt art pice

MIT Licensed

Similar vizzes

Loading thumbnail…

Frank Stella Reproduction

This example reproduces a Frank Stella-style geometric composition using overlapping horizontal and vertical striped bands. The visualization shows a dynamic interplay of red and yellow stripes, with their visibility controlled by two triangular mask regions that reveal or hide portions of the stripes. The code uses the SVG JavaScript API to create elements dynamically, defining masks with `mask` elements and `path`/`rect` primitives. The rendering approach relies on layered rectangles with alternating fills and stroke styles, clipped through the masks to generate the final intersecting pattern.

Mmaciekawsq@gmail.com

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

78% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction Vertical

This example recreates a Sol LeWitt–inspired geometric composition using only SVG primitives and masking, showing a grid of thin vertical and horizontal bars that intersect to form a central circular void. The work emphasizes the contrast between ordered line work and negative space, creating a pseudo-visualization that mimics algorithmic drawing without encoding external data. The code relies on the raw DOM APIs `document.createElementNS` and `setAttribute` to construct the SVG elements, while two `<mask>` definitions with inverted fills (white background with black circle, black background with white circle) selectively reveal the vertical strokes inside the circle and the horizontal strokes outside it. No external libraries are used; the font is loaded via Google Fonts’ “Share Tech” for the text styling.

Ccome.grant@gmail.com

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

77% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt art piece using SVG elements and mask-based compositing. It shows a grid of horizontal and vertical stripes that intersect within a central circular region, creating a geometric pattern where line orientations alternate inside and outside the circle. The code uses raw SVG DOM manipulation via `createElementNS` to build rectangles and defines two masks (`circle-mask` and `circle-mask-2`) to control visibility. Horizontal stripes appear inside the circle, while vertical stripes fill the outer area, demonstrating how SVG masks can selectively reveal layered shapes.

MMarcus Vinicius da Silveira Richa

77% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction Verticle

This example reproduces a Sol LeWitt-inspired drawing using only SVG shapes. It shows a grid of thin horizontal and vertical rectangles overlaid on the full viewport, with a circular mask creating a central aperture. The code uses the raw DOM API via `document.createElementNS` to build the SVG, `mask` elements to define clipping regions, and `rect` elements for the grid lines. Two complementary masks isolate the horizontal and vertical strokes, producing a clean intersection effect. No external libraries are used; the rendering relies entirely on native SVG attributes and JavaScript.

PPrince Kumar

76% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt art piece, showing a grid of horizontal stripes confined to a circular region, with vertical stripes filling the surrounding area. It uses D3 v6 selections and data joins to generate the SVG rectangles, while SVG mask elements create the circular boundary and its inverse. The code builds two masks with `create_circle_mask`, applying them to the stripe groups to achieve the geometric composition. The rendering is entirely SVG-based, with dimensions fixed at 960 by 500 pixels.

Aamauris@outlook.com

76% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using only SVG and JavaScript, creating a grid of alternating horizontal and vertical bands. Two circular masks reveal the layered strokes: the first mask exposes vertical strips within a centered circle, while the second inverts that region to show horizontal strips outside it. The code generates 100 rectangles per direction, each 10 pixels thick, using the `document.createElementNS` API and SVG `mask` elements to compose the visual interplay. The result is a clean, geometric abstraction that mimics the artist’s instructional art style.

Mmavercikalvin

76% match