Matthew A. Cottrell

Work / 02 · Generative art

linefield

Twenty-nine generative line-art backgrounds you own outright.

Role
Design and build
Year
2026
Status
Live, v2
Stack
Canvas 2D, no dependencies
Numbers
29 pieces · 434 controls · 0 dead
Links
Gallery · Source
The top of the linefield gallery: the headline Generative backgrounds, shipped as one file, a short intro, the Wake overlay panel, six collection filters, and the first row of the Currents collection, three monochrome hairline pieces on near-black.
  1. Six collections behind one filter. Space is the newest.
  2. Wake, an opt-in pointer overlay, kept out of the pieces.
  3. Stills by default. The card you point at runs live.
Fig. 1 · The gallery: twenty-nine pieces in six collections, monochrome by default.

Running live

Grain Field, baked.

One of the twenty-nine, exported as a single HTML file and dropped into this page. No dependencies, no build step.

A background is the kind of thing you should own outright. It sits on your site for years, it should not phone home, and when you want it slower or bluer you should be able to open the file and change it.

linefield is twenty-nine of them. Each piece is one HTML file with no dependencies and no build step. Tune it with the on-screen controls, hit export, and you get a standalone file with your settings baked in. Paste it into any page and it runs.

What it is

Twenty-nine pieces in six collections, one shared control surface:

  • Monochrome by default. Near-white hairlines on near-black, one subject per frame, and room left for your headline. Brightness comes from lines crossing, not from colour. Colour is still one preset away. It just isn't the default any more.
  • Framed by one slider. Scale runs every piece from a small object with room around it to edge to edge across the screen. The defaults sit wherever each piece reads best at full width, not in a thumbnail.
  • Sixteen controls on every piece. Scale, speed, stroke, opacity, saturation, color mode, two colors, two hues, invert, glow, angle, motion, phase and density, plus whatever each piece needs on its own. A script drives every control on every piece and diffs the rendered frames: 434 controls, none of them dead. It exists because twice a control shipped that read its value and changed nothing, and both times a human review passed it.
  • Five ways out. A baked HTML file with every shared module inlined, the untouched source, PNG at 2x or 4x, SVG, and a written prompt describing the current settings. The baked file is the point. It has zero external references, so it runs from any folder on any host. For decks and mockups there is also a pack of square stills of every piece, and a catalogue listing each piece's empty zone and controls.
  • Two new materials. Dune is a ridge of film grain under one low light. Swell is an ocean swell drawn as a halftone screen, where the size of each dot carries the light. Both step outside pure linework, and both still run in plain Canvas 2D.
  • A space series. Five pieces in a sixth collection: a planet's magnetic tail pinching where it reconnects, a galaxy seen edge-on with its dust lane turning, a stream of stars torn between two galaxies, a cratered planet's dawn line seen from low orbit, and a dust cloud cut out of a starfield. No glowing planets, no spirals. Each one started as a throwaway sketch and was only built once it held up at full width.
  • A gallery that will not cook your laptop. Twenty-nine canvas animations running at once will crawl, so the grid shows stills and swaps only the card you are pointing at for a live preview. One at a time, torn down when you look away. Keyboard focus does the same thing, because hover-only interaction is invisible to anyone not using a mouse.

What it actually took

Drawing the pieces was the easy half. The hard half was catching the things that look correct on paper. A control whose maths is right but whose effect is smaller than the line it draws. A baked export that silently produced a blank page for two pieces because a new module was never registered for inlining, which two separate reviews reported as passing.

The worst one was not a bug at all. Five pieces shipped that were each individually fine and collectively looked like one thing, because every review judged a piece against its own intent and never against the others.

So the checks are scripts now instead of opinions. The build refuses to run when the manifest, the pieces and the README disagree. The control audit fails on anything that reads a value without changing a pixel. And the last gate before shipping is looking at all of them side by side, which is the only one that would have caught the thing a person actually noticed.

So the checks are scripts now instead of opinions.

From “What it actually took”

Version two

Version one worked and still looked like a demo. Laid out side by side, the problem was colour. Every piece had its own saturated hue, so eighteen pieces read as eighteen different products instead of one collection.

So version two is monochrome first. Every piece was redrawn as one object: hairlines, one bright point, and a lot of empty space for whatever sits on top of it. A new gate fails the build if a default carries colour or marks too much or too little of the frame.

Then it went too far the other way. On a wide screen most pieces were an island in the middle of the dark, so Scale became the framing control and the defaults moved up until each piece uses the canvas.

There is no target count. A new piece ships when it clears the same gates as the rest.