Skip to main content
SimilarExport ZIP
100%

Polka dot

✓ Published0🌍 Public
335degrees
Last edited May 22, 2017
Created on May 22, 2017

A single web page uses only CSS to create a repeating polka-dot pattern across a maroon background. The page defines a radial-gradient with two layered positions, setting tan circular dots at 20% size with transparent surroundings, tiled at a 30-pixel grid and offset by 15 pixels to form the staggered dot matrix. No JavaScript runs beyond a commented-out alert, and no external data is loaded, so the visualization is purely a static CSS background experiment from a Gist. The split view shows the CSS source alongside a live preview, with the HTML body left empty.

AI-generated description

Similar vizzes

Loading thumbnail…

Invisible dots

Fifty identical black rounded squares fill a browser window, each rendered as a plain `<div>` with no visible content, creating a uniform grid of "invisible dots" against the white page. The example uses a simple `for` loop in vanilla JavaScript to append each element to the document body, with CSS flexbox controlling the wrap layout. The code intentionally corrupts the loop syntax with malformed `i < 50` conditions, revealing an authoring error that prevents execution. No external libraries or data sources are used; the visualization relies solely on raw DOM manipulation and static styling.

Ggragors123@gmail.com
74% match
Loading thumbnail…

Invisible Dots

A grid of 50 black rounded squares fills the browser window, each one a styled `<div>` created dynamically by a `for` loop that calls `document.createElement` and appends it to the body. The squares appear as a uniform, static pattern, yet the title suggests the presence of invisible dots. No external libraries or data sources are used; the visualization relies solely on raw HTML, CSS (flexbox layout with fixed `84px` dimensions and `margin` spacing), and vanilla JavaScript to construct the display.

CCurran Kelleher
74% match
Loading thumbnail…

Invisible dots

Fifty black, rounded squares form a silent grid on a white background, each one a uniform tile with no visible variation. The piece demonstrates a simple HTML and JavaScript loop that creates the elements using `document.createElement` and `document.body.append`, with styling applied via CSS properties for size, margin, and border-radius. There is no interaction, animation, or data binding, only the static repetition of identical shapes. The title suggests an absence or a hidden pattern, but the code does not implement any such behavior, leaving the visual composition purely as a minimal exercise in layout generation.

Ggragors123@gmail.com
71% match
Loading thumbnail…

Fork of Invisible Dots

A dense grid of fifty black, rounded squares fills the browser window, each occupying a static 84-by-84-pixel cell. The code generates these squares with plain JavaScript in a loop, appending them to the document body via `document.createElement` and `append`. No data or interaction is present; the visualization is purely a minimalist geometric pattern created through standard DOM manipulation and CSS styling, with no external libraries or rendering APIs involved.

Llimenzi
71% match
Loading thumbnail…

Invisible Dots

Black rounded squares tile a dark canvas in a dense, uniform grid. The visualization emphasizes the interplay of negative space and repetition, as the 84-pixel elements with soft corners create a rhythmic pattern across the viewport. Each square appears identical, making any subtle variations in lightness or shape imperceptible to the eye, reinforcing the title’s notion of invisibility. Built with vanilla JavaScript, the page dynamically appends 50 `div` elements to the body, styled entirely through embedded CSS. No external libraries are used; the effect relies purely on the DOM’s `createElement` method and flexbox wrapping to arrange the components.

Ppnsvk
70% match
Loading thumbnail…

500 glowing dots

Five hundred glowing dots scatter across a dark, square SVG canvas. Each dot consists of a larger outer circle filled with a cyan radial gradient and a smaller, brighter white inner circle created using SVG `radialGradient` definitions. A plain `for` loop generates the dots at random positions within a fixed boundary, using D3 v4 to append `circle` elements and apply CSS classes for styling. The result is a dense, luminous field of varied-sized orbs against a near-black background.

PPatrick Wojda
68% match
Loading thumbnail…

Invisible Dots

Invisible Dots arranges 50 empty div elements in a vertical stack, each one generated by a JavaScript for loop and appended to the document body. A single small inline SVG containing a black square rect sits above them, rendered without any visible fill or stroke. The piece uses raw HTML, CSS, and JavaScript—no external libraries—to explore the contrast between an explicit graphical mark and the implicit structure of unstyled block elements. The minimal styling leaves the SVG’s default black fill as the only visual output.

Ggragors123@gmail.com
67% match
Loading thumbnail…

100,000 dots

This visualization displays 100,000 randomly positioned dots, each with a unique color, opacity, and size, rendered as a single dense field. The dots are generated with D3's `scaleSequential` and `interpolateWarm` for the color palette, `randomExponential` for radius distribution, and uniform random functions for coordinates and opacities. The scene is drawn using the Regl library on a WebGL canvas, with a custom fragment shader applying antialiasing and per-dot blending for a smooth, overlapping presentation.

NNita
67% match