◇ build guide
Shadows of the fourth dimension: three regular 4-polytopes in genuine R⁴, turned through a double rotation and cast into the room by stereographic projection.
A single-screen observatory for the three most legible regular 4-polytopes — the tesseract, the 16-cell and the 24-cell — for anyone who has heard "a tesseract is a 4D cube" and never been shown what that actually buys you. The page's one job: make the visitor feel the double rotation — two planes turning independently at once, sharing only a point — the one motion that cannot exist in three dimensions.
Manrope carries the display voice — the wordmark sets an ultralight 200 against a bold 700 in one word ("POLY·tope"), tracked to .3em, the typographic brave moment. Red Hat Mono does the instrument work: Schläfli symbols, element counts, rotation-angle readouts — anywhere a number needs to feel measured rather than decorative.
Everything is procedural, two files, no build step. The vertices are true 4-vectors:
the tesseract's 16 points at (±1,±1,±1,±1), the 16-cell's 8 at
±eᵢ, the 24-cell's 24 as permutations of (±1,±1,0,0) — edges derived
by nearest-neighbour dot products (32 / 24 / 96), never hard-coded.
The signature is the double rotation + stereographic projection pipeline.
Each frame every point is rotated in two independent planes — xy by θ₁, zw by θ₂, with
incommensurate angular speeds so the motion never repeats — then projected from the unit
3-sphere through a pole at w = 1.18: P = (x,y,z)·k/(c−w). Because
every edge is subdivided into 14 chords re-normalised onto S³, straight 4D edges project as
circular arcs, the honest stereographic look; the perspective division by
(c−w) is what makes the inner cell swell as it comes toward the pole and shrink
as it recedes — an orthographic drop of w would leave it frozen. Rendering is a single
three.js LineSegments buffer (additive, vertex-coloured, opacity graded on w) plus
a small ShaderMaterial point cloud for the vertices, which flare white when they
graze the projection pole — the second-read detail, whispered in the corner readout.
| Polytope | Schläfli | V | E | F | C |
|---|---|---|---|---|---|
| Tesseract | {4,3,3} | 16 | 32 | 24 | 8 |
| 16-cell | {3,3,4} | 8 | 24 | 32 | 16 |
| 24-cell | {3,4,3} | 24 | 96 | 96 | 24 |
Drove the full cycle headless (7-second settles, placard switches asserted on 16/32/8 →
8/24/16 → 24/96/24). Two real finds: the additive edges read near-white — the depth grade was
too generous at mid-w — so the alpha curve was steepened to d³ on a
d^1.5 colour mix, letting the far hemisphere sink into core-glow violet; and on
375px the two-phrase eyebrow wrapped into the nav, so the "stereographic survey" phrase now
drops at ≤640px. Removed the trailing ◇ tick and a pointless negative text-indent.
Enriched the swap: instead of a flat crossfade, the whole projection now recedes toward the pole (k eases down 16%) as one polytope dies and the next grows back — the switch itself now reads as motion along w. Verified the two-plane assertion holds mid-swap (θ₁/θ₂ speed ratio 1.517 measured vs 1.517 specified). The pole-graze whisper — vertices flare white above w = 0.94 and a mono caption fades in — was tuned against real frames so it fires roughly once per polytope, not constantly.
A 3× zoom on the frame caught a black square haloing each pole-flare: the point sprite
wrote alpha 1 across its whole quad, so the transparent canvas replaced the page's CSS glow
with near-black at the quad corners (premultiplied compositing). Fixed at the root — the
canvas is now opaque and the violet glow is painted in-scene by a fullscreen background
shader, so the additive passes never touch page compositing. 375×812: scrollWidth exactly
375, wordmark/nav/tabs/colophon all inside the box; blurb hides under 560px height so the
placard never collides with the masthead. Reduced-motion
verified by emulation: one settled frame at t = 6 s — tesseract mid-turn, inner cell passing
through — two screenshots 1.3 s apart hash identical, zero console errors. Context-loss path
swaps in a static SVG tesseract shadow. DPR capped at 2, rAF cancelled on
document.hidden with a clamped resume delta, drag orbit pointer-captured.