Skip to main content
SimilarExport ZIP
100%

Ep. 3.2 - SoL LeWitt Art Reproduction - MK

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

This example reproduces a Sol LeWitt-style wall drawing using raw SVG. It shows a series of one hundred thin vertical rectangles evenly spaced across the full browser viewport, creating a minimalist striped pattern. The code generates the SVG element dynamically via the DOM API `document.createElementNS`, setting its width and height to match `window.innerWidth` and `window.innerHeight`. Each rectangle is positioned at a fixed increment of 20 pixels along the x-axis, with a width of 10 pixels and a height equal to the viewport, resulting in a regular, repeating visual rhythm.

AI-generated description

A demo of SoL LeWitt Art.

MIT Licensed

Similar vizzes

Loading thumbnail…

Ep. 3.3 - SoL LeWitt Art Reproduction Vertical - MK

This example reproduces a Sol LeWitt-inspired drawing using the raw SVG API and the DOM’s `createElementNS` method. It renders 100 horizontal and 100 vertical gray rectangles in a grid, with all horizontal bars clipped by a circular mask applied via an SVG `<mask>` element. The mask, centered on the viewport, reveals only the horizontal strokes inside its 200-pixel radius while the vertical bars remain fully visible, creating a layered geometric pattern. The visualization uses `window.innerWidth` and `window.innerHeight` to size the full-screen canvas.

Mmattykuch
91% match
Loading thumbnail…

Ep. 3.4 - SoL LeWitt Art Reproduction Final - MK

This example reproduces a Sol LeWitt–style wall drawing using SVG masks to create intersecting stripe patterns. A central circular mask reveals a grid of horizontal and vertical colored bands, while a second inverted mask swaps the visible regions, producing a layered composition of alternating line orientations. The code builds all elements programmatically via the raw SVG DOM API, generating 100 horizontal and 100 vertical rectangles with the `createElementNS` method. No external libraries are used; the full-screen visualization relies solely on native SVG mask and rectangle elements.

Mmattykuch
91% match
Loading thumbnail…

Sol Lewitt Reproduction

This example reproduces a Sol LeWitt-inspired wall drawing using raw SVG elements created directly through the DOM API. It shows a series of 100 thin vertical rectangles evenly spaced across the full height of the browser viewport, creating a minimalist striped pattern. The visualization uses `document.createElementNS` to generate SVG `rect` elements, setting each rectangle’s width to 10 pixels and its horizontal offset to 20 pixels apart. No external libraries are used, relying purely on vanilla JavaScript and CSS to render the geometric composition dynamically based on the window size.

HHéloïse Feldmann
84% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a minimalist Sol LeWitt-style geometric composition using dynamically generated SVG shapes. As the page loads, the code creates a full-viewport SVG canvas and populates it with a repeating grid of narrow vertical rectangles, producing a uniform striped pattern reminiscent of LeWitt’s wall drawings. The implementation builds the entire scene through the raw SVG DOM API, calling `document.createElementNS` and `setAttribute` to position each rectangle. The stripes are drawn with fixed 20-pixel spacing and a 10-pixel width, which means the pattern’s density scales with the browser window’s width as the viewport resizes. No external libraries are used; the underlying JavaScript directly manipulates the SVG elements without a helper framework.

JJacky Wu
84% match
Loading thumbnail…

Sol Lewitt Reproduction

This example reproduces a Sol LeWitt wall drawing as an interactive SVG visualization. It renders 100 vertical rectangles, each 10 pixels wide, evenly spaced across the full viewport height. The code uses the SVG API to create and append each rectangle dynamically via `document.createElementNS`. All shapes are generated procedurally without an external dataset, directly mimicking LeWitt’s geometric style. The result is a minimalist, full-screen composition that fills the browser window.

KKathleen Johnston
83% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces Sol LeWitt’s wall drawing using raw SVG elements, creating a visual grid of rectangles. It begins with a single rect drawn to the page, while commented-out code outlines a more complex masked pattern of horizontal and vertical stripes. The code uses no D3 API calls for rendering, instead relying on the standard DOM methods `document.createElementNS`, `setAttribute`, and `appendChild` to build the SVG structure. The file references D3 version 7 in its JavaScript, but the active implementation is pure vanilla SVG manipulation.

DDyor69
83% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt-inspired geometric composition using raw SVG and JavaScript. It shows a systematic grid of thin, evenly spaced vertical bars that span the full height of the viewport, creating a rhythmic, minimalist pattern reminiscent of LeWitt’s wall drawings. The code creates an SVG container sized to the browser window and appends 100 rectangles, each positioned at increasing x-coordinates with a fixed width, using the `document.createElementNS` API for SVG elements. The rendering relies solely on native DOM manipulation and CSS styling via an embedded stylesheet, with no external libraries beyond a Google Font import for the text styling.

Mmaciekawsq@gmail.com
83% match
Loading thumbnail…

L3 JS Sol Lewitt Reproduction

This example reproduces a Sol LeWitt-style wall drawing as a generative SVG composition. It shows a series of 100 vertical stripes, each 10 pixels wide and spaced 20 pixels apart, spanning the full height of the browser viewport. The code creates an SVG element from scratch using the standard DOM API, specifically using `document.createElementNS` to build and append each `<rect>` element. The artwork is rendered entirely client-side with no external data or JavaScript libraries, relying solely on vanilla scripting to produce a minimalist, grid-based pattern.

Bbarryhillier
83% match