Colophon

This site is drawn the way it describes. Every ornament is a program, not a picture: composed from a small catalog of shapes, on a fixed grid, with a small and named amount of disorder, from a seed derived from the page itself.

The structure never changes. The detail always does. That is the method of the artist Vera Molnár, described on the history page, and it is also a working definition of declarative generative UI: a catalog, a renderer, and a budget for how much to vary. The analytics page argues that a generated interface should keep a record of what it drew. This site does: every ornament is reproducible from its seed.

The disorder budget

Each shape takes a disorder value between 0 and 1. The budget is set per surface. The mark holds to about one per cent, 0.012, Molnár's figure, so the site has one steady shape. The heroes above each page are given far more, around 0.15, because they sit above the text rather than behind it, so the variation should be seen. The 404 is pushed furthest, to 0.25, where the structure dissolves. At 0 the system is only tidy, not generative. Below, each shape in the catalog is drawn at three values so the parameter is visible: tidy, the hero range, and the 404.

Carres

disorder 0

disorder 0.15

disorder 0.25

Desordres

disorder 0

disorder 0.15

disorder 0.25

Paralleles

disorder 0

disorder 0.15

disorder 0.25

Lattice

disorder 0

disorder 0.15

disorder 0.25

The mark

One shape does not change per page, so the site has something stable to remember it by. It is a single catalog shape locked to the site seed, and it is also the favicon.

How it is made

Ornaments are generated during the static build and inlined as SVG, so no client script is needed to see them. Strokes use currentColor, so one drawing serves both color schemes. The seed for a page is derived from its own source text, which means editing a page redraws its ornament. Every edit leaves a mark.