How this was made

Zero images. Every visual on the site is arithmetic, executed at 60fps.

This is a code-art site: a single HTML file whose homepage invents a human profile for every visitor. No photography, no stock, no AI image calls — just a seeded random number generator and fourteen thousand particles.

Inventing a face

A visit derives a 32-bit seed from the clock. A mulberry32 PRNG expands it into a face recipe: brow prominence, nose length and tip, lip fullness, chin projection, skull height, facing direction, and one key light (angle + softness). The profile's front edge is a piecewise curve — forehead, brow notch, nose wedge, two lip bumps, chin ball, neck — each term a smoothstep window scaled by its recipe value:

x += (s(.36,.50,t) − s(.50,.545,t)·1.15) · noseLen · .16   // the nose

The closed silhouette is rasterized once to an offscreen 230×230 canvas; every opaque pixel becomes a candidate particle target, shaded by its distance to the key light (b = (1−d)^(1.6/softness)).

The grains

14,000 particles (7,000 on mobile, 5,000 under reduced motion) ease toward their targets with p += (t−p)·0.085, breathe on individual phase offsets, and flee the cursor inside a 90px radius. Brightness picks the ink: warm grain for lit skin, dun for half-tone, rose madder for shadow — so the light angle in the recipe is legible in the render. "Summon the next sitter" advances the seed with an LCG and the same particles reflow into a new stranger — nothing is recreated, only retargeted.

Type as a variable

The whole site is set in a single variable font, Archivo, driven along its width axis: 125 (extended, 800) for display, 110 for arguments, 75 (condensed) for data — one family, three voices, no second download.

Honest constraints

• prefers-reduced-motion: particle count drops, drift slows to settling dust, reveals disable.
• The canvas pauses entirely when the hero scrolls out of view.
• DPR capped at 1.6; positions live in one flat Float32Array — no per-particle objects, no GC churn.

Deployment

npx wrangler pages deploy set1-c --project-name=set1-c

A static folder on Cloudflare Pages — the first deploy creates the project and returns the live URL. Three self-critique passes (desktop 1440 / mobile 390, five scroll depths) ran before shipping; the log is in NOTES.md.

Designed and built end-to-end by Claude Fable 5.