Fork of Sol Lewitt Reproduction

100%

Fork of Sol Lewitt Reproduction

✓ Published1🌍 Public

Last edited Dec 29, 2023

Created on Dec 29, 2023

This example reproduces Sol LeWitt’s geometric wall drawing using SVG masks and repeated rectangles to create intersecting striped patterns. A circular mask reveals portions of horizontal and vertical bars, while the second mask inverts the visibility to produce a checkerboard-like overlap. The page uses raw JavaScript with `document.createElementNS` to build the SVG dynamically, sizing elements to the full browser window. No external libraries are required, and the work is a direct homage to the artist’s instructional art.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Fork of Sol Lewitt Reproduction vertical

This example reproduces a Sol LeWitt-inspired drawing using raw SVG and JavaScript without any external libraries. It renders two sets of overlapping rectangles: 100 horizontal stripes and 100 vertical stripes, both evenly spaced across the full window size. A circular mask, defined via the SVG `mask` element, restricts visibility of the horizontal stripes to a centered circle, creating a layered geometric effect. The code dynamically creates SVG elements using `document.createElementNS` and appends them to the page, with all dimensions derived from `window.innerWidth` and `window.innerHeight`.

HHéloïse Feldmann

93% match

Loading thumbnail…

Fork of Fork of Fork of Sol Lewitt Reproduction Vertical 4

This example creates a generative geometric composition inspired by Sol LeWitt, displayed as horizontal and vertical stripes across the screen. Two SVG masks—one with a white circle on black, another with a black circle on white—reveal alternating sets of striped rectangles, producing a crosshatch pattern where the stripes overlap. The visualization uses vanilla JavaScript with the DOM API to construct SVG elements dynamically, setting the width and height based on the browser window. It shows how masking and nested loops can generate a structured, Op-Art-like visual effect without external libraries.

Eelgato_1994

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

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

91% match

Loading thumbnail…

Fork of SVG Sol LeWitt

This example reimagines Sol LeWitt’s geometric wall drawings as an interactive web visualization, generating layered horizontal and vertical stripes that intersect within two circular masks. The code builds SVG elements entirely via the DOM API (`document.createElementNS`), setting attributes directly on each rectangle without a data-binding library. A white-filled mask reveals alternating 10-pixel-wide horizontal bars, while a second inverted mask displays vertical bars of the same thickness, creating a crosshatch pattern framed by the centered circle. The sketch responds to the browser window size by setting the SVG width and height from `window.innerWidth` and `window.innerHeight`.

Mmax-31

91% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using two sets of horizontal and vertical stripes that interact with a circular mask. The circle at the center masks the horizontal stripes, while an inverted mask allows vertical stripes to appear only inside a second circular region. The code builds an SVG dynamically with JavaScript, creating 100 striped rectangles in each orientation and applying SVG masks to achieve the visual effect. It demonstrates a stark, geometric composition based on the artist’s generative instructions.

Xxyzcorrupt@gmail.com

90% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using raw JavaScript and the SVG API. It generates a grid of horizontal and vertical stripes, masked by two inverse circular masks to create a composition of intersecting lines. The code directly creates SVG elements via `document.createElementNS`, setting attributes for rectangles and masks to control the visible pattern. The rendering is dynamic, adapting to the browser window's full width and height.

DDilara Bozkurt

90% match

Loading thumbnail…

Fork of Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using generative linework confined to circular masks. Horizontal and vertical striped rectangles are layered across the full canvas, with an SVG mask revealing only the central circular area for each orientation. The piece uses pure JavaScript and the SVG API, creating two masks and drawing one hundred striped rectangles of alternating orientation. The result is a minimalist, geometric composition that directly emulates LeWitt’s instructional art style.

JJulia Ustits

90% match