# v02-vectorscan

**The idea.** A drawing made of strokes. Nothing on the page is filled: every
box is a hairline, every surface is the page black, and the type is set in the
mono face throughout. The claim is outlined rather than solid — the letters
are 1.5px of phosphor with the page showing through them.

**The tool list is an instrument with two halves.** The right half is a plain
index of names, one per line with its languages. The left half is a single
readout panel, sticky to the top of the window, that answers whichever name
the reader is pointing at or has tabbed into: the name, the languages, the
description and the two links. Pointing takes a phosphor rule down the left
edge of that line, indents it, and re-plays the panel's entry; the rest of the
index is left exactly as it was. No other variation reads one item at a time
this way.

Every fact the panel shows is also in the item's own markup, visually hidden
on the desktop. A screen reader, a search engine and a phone all get the
description from the item itself, so the panel adds a way to read the page
and never becomes the only one.

**Wireframe field.** Three depths of outlined polygons behind the hero,
generated at build time from the tool names with a seeded generator: nine
small shapes at 0.1 of the scroll rate, six mid ones at 0.26, four large ones
at 0.48. Plus the dot grid at 0.22 — four rates on the first screen.

**Dither.** The two filled things on the page are both ordered dither: the
horizon at the foot of the first screen (a canvas ramp from black up into
phosphor) and the band before the sign-up, which carries a drifting coarse
checker on parallax.

**Palette.** Phosphor `#39ff88` with its highlight `#a9ffcb` on `#040705`.
One accent only; the offset shadow is turned off entirely (`--shadow-x: 0`),
because a solid shadow is a filled shape.

**Type.** Plex Mono everywhere, uppercase and letter-spaced in the headings.
The sans face appears only in the descriptions on the phone layout.

**Notches.** Top-left on the readout panel, bottom-right on the buttons and
the sign-up boxes.

**Arrows.** Two thin (3px) long-dashed traces in phosphor, running down the
left margin: the hero buttons into the index heading, and the last index line
into the sign-up.

**Density.** Low. A hero that fills the first screen, then one index, then two
boxes.

**Mobile (390px).** The readout panel is not rendered; each index line opens
into name, languages, description and two 44px links instead, so the page
becomes one long readable list. Only the far wireframe depth is kept, the
outline stroke thins to 1px, and the buttons go full width.
