Skip to main content
SimilarExport ZIP
100%

Sol LeWitt Reproduction

✓ Published1🌍 Public
Nnreinig3@gatech.edu
Last edited Dec 2, 2023
Created on Dec 2, 2023
Forked from Javascript basics

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.

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

Sol LeWitt Reproduction

This visualization reproduces the minimalist aesthetic of a Sol LeWitt wall drawing. It displays a series of vertical black bars that are evenly spaced across the full height of the browser window, creating a rhythmic, grid-like pattern. The piece works by using JavaScript to dynamically generate SVG `rect` elements within the HTML document. The code sets the number of rectangles to 100, positions them at intervals of 20 pixels, and gives each a width of 10 pixels, resulting in an abstract, geometric composition that fills the screen.

KKhatera Alizada
92% match
Loading thumbnail…

Sol LeWitt Reproduction Vertical

This example renders a vertical Sol LeWitt-inspired composition using raw SVG and JavaScript. It creates 100 rectangle elements, each 10 pixels tall and spaced 20 pixels apart, stacked vertically across the full width of the browser window. The rectangles are appended directly to an SVG element created via the Document API, with the total canvas size determined by `window.innerWidth` and `window.innerHeight`. No additional libraries are used; the code relies solely on native DOM manipulation and SVG attributes.

DDonald Bagwell
92% match
Loading thumbnail…

Sol LeWitt Reproduction

This visualization reproduces a Sol LeWitt-inspired geometric composition using only SVG rectangles, creating a rhythmic pattern of vertical bars across the full viewport. The code generates 100 rectangles, each 10 pixels wide and positioned at 20-pixel intervals, using the Document Object Model (DOM) method `createElementNS` to construct SVG elements in plain JavaScript. The rectangles stretch from the top to the bottom of the window, with their height tied to the viewport’s dimensions. The minimalist approach mirrors LeWitt’s instructional art style, relying on simple, repeated shapes to produce a clean, abstract visual statement.

CCeciliaW888
91% match
Loading thumbnail…

Sol Lewitt Reproduction

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.

GGbemiga Atolagbe
91% 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
91% match
Loading thumbnail…

Sol LeWitt

This example generates a minimalist SVG composition inspired by Sol LeWitt, displaying 100 vertical rectangles evenly spaced across a 960-by-500-pixel canvas. Each rectangle maintains a fixed width of 10 pixels and spans the full height of the canvas, creating a rhythmic, striped pattern. The visualization is built programmatically using raw JavaScript and the SVG API, specifically creating SVG elements via `document.createElementNS` and appending them to the document. No external libraries are used; the rendering relies entirely on native browser support for SVG and scripting.

NNikki Masroor
90% 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
90% match