Skip to main content
SimilarExport ZIP
100%

Sol Lewitt Reproduction

✓ Published1🌍 Public
GGbemiga Atolagbe
Last edited May 1, 2024
Created on Apr 3, 2024
Forked from HTML Starter

This example reproduces a Sol LeWitt-style wall drawing by generating a grid of vertical black stripes across the full browser viewport. The code creates an SVG canvas using the DOM API, then appends 100 rectangle elements, each 10 pixels wide and spaced 20 pixels apart, filling the entire height. A simple loop handles the repetitive pattern, demonstrating how procedural geometry can mimic minimalist art. The rendering relies on native SVG creation via `document.createElementNS` and window dimensions to adapt the composition to any screen size.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

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
93% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a minimalist Sol LeWitt-style drawing using an SVG canvas that fills the browser window. It generates 100 vertical rectangular stripes, each 10 pixels wide and spaced 20 pixels apart, spanning the full height of the viewport. The code creates SVG elements dynamically via the `createElementNS` API and sets attributes like `x`, `width`, and `height` directly, without any external libraries. The rendering approach relies purely on JavaScript and SVG, with no data source or interaction beyond the static geometric composition.

MMonWas
93% match
Loading thumbnail…

SOL LEWITT REPRODUCTION

This example reproduces a Sol LeWitt-style drawing using only JavaScript and SVG, rendering a series of vertical black rectangles across a white canvas. The code creates a full-window SVG element and programmatically appends 100 narrow rectangles, each spaced 20 pixels apart with a width of 10 pixels, using the `createElementNS` API from the SVG specification. The rectangles stretch the full height of the viewport, producing a minimalist grid-like pattern that echoes LeWitt's geometric wall drawings. The piece demonstrates generative art through direct DOM manipulation without any external libraries.

JJude-Clarke
93% match
Loading thumbnail…

Sol Lewitt Reproduction Vertical

This example reproduces a Sol LeWitt-style drawing as a vertical sequence of horizontal stripes, clipped by a circular mask centered on the screen. It shows how generative geometry can create a minimalist composition directly in the browser. The code uses raw SVG APIs via `document.createElementNS` and `setAttribute` to construct 100 rectangles, each 10 pixels tall, spanning the full viewport width. A `mask` element with a white circle limits visibility, while the page fills the entire window with no margins or scrolling. The rendering approach is entirely procedural, using only vanilla JavaScript and SVG without external libraries.

Eelgato_1994
91% match
Loading thumbnail…

Sol LeWitt Reproduction

This example displays a series of 100 thin, vertical rectangles arranged horizontally across the screen, each spanning the full height of the browser window. It creates a minimalist, striped visual composition that fills the viewport. The code generates an SVG element using the Document API and sets its dimensions to match the window size. It then uses a JavaScript loop to create and append each rectangle, spacing them at 20-pixel intervals with a width of 10 pixels, resulting in a patterned grid-like aesthetic.

Nnreinig3@gatech.edu
91% match
Loading thumbnail…

Sol Lewit Repro

This example presents a generative art piece inspired by Sol LeWitt, rendered by drawing a series of vertical stripes across the full browser window. The visualization uses raw JavaScript with the Document Object Model (DOM) API, specifically creating Scalable Vector Graphics (SVG) elements via `document.createElementNS`. The code generates 100 rectangles, positioning each one along the x-axis with a fixed width and making them stretch the entire height of the viewport, resulting in a clean, minimal striped pattern that echoes LeWitt's systematic wall drawings. The artwork automatically adapts to the current window dimensions.

HHayden-V
91% match
Loading thumbnail…

Sol LeWitt Reproduction

This example reproduces a Sol LeWitt wall drawing using pure browser APIs, with no external libraries. It renders 100 horizontal and 100 vertical rectangles in SVG, layered so that a circular mask reveals the grid pattern at the center while masking the opposite orientation at the edges. The code constructs the SVG, masks, and shapes programmatically via `document.createElementNS`, setting attributes like `fill`, `r`, and `mask` on each element. The layout adapts to the full viewport size using `window.innerWidth` and `window.innerHeight`.

Nnpinta
91% match
Loading thumbnail…

Sol LeWitt Reproduction Vertical

This example reproduces a Sol LeWitt-inspired wall drawing using raw SVG and JavaScript. It presents a grid of horizontal and vertical stripes that intersect through two circular masks, creating a layered composition with a central white circular void and a black circular overlay. The code constructs SVG elements directly via the DOM API, including `rect` shapes and two custom `<mask>` definitions, to alternate stripe visibility. A total of 200 rectangles are generated programmatically, with no external libraries or frameworks, relying solely on browser-native SVG rendering to achieve the geometric effect.

GGbemiga Atolagbe
90% match