Imaginatio · CSS art · unique instance

Chrysopoeia-17

A generative sculpture that exists only as CSS on this page. No canvas, no SVG illustration, no image file — light is mixed from gradients, clip-paths, dihedral rotation, and a φ-spiral of rhombs. Composed 28 August 2026 at 02:45 EDT for lucastilford.com.

LMT · 28.VIII.2026
06:45Z
D₁₇
pentagrid
φ-spiral × 28
7∶11
2026 ≡ 226°

Move the pointer to tilt the chamber. Seventeen sectors (a prime fold almost never used in kaleidoscopic toys) scan a de Bruijn pentagrid — the same five-direction bar family that dualizes to a Penrose tiling — while 28 golden rhombs walk the golden angle and a 3∶5 Lissajous traces the nucleus.

Live CSS · no canvas

Chrysopoeia-17 · D₁₇ × pentagrid × φ · 28.VIII.2026

Ammann–Beenker octagrid

Four bar families at 0° / 45° / 90° / 135° — the Ammann decoration of the 8-fold quasicrystal. Month 8 encoded as an 8-point star over a square-rhomb lattice.

Möbius chromatograph

Two CSS rings, masked to bands, crossed in 3D and hue-locked to seed 226° (year 2026 mod 360) and its gold complement 46°. A one-sided color engine.

Colophon — why this cannot be a template

Kaleidoscopic CSS art almost always uses 6, 8, or 12 folds because 360 divides evenly. This piece uses 17, a prime. The sector angle is 360°/17 ≈ 21.176470588°. Seventeen wedges, two pentagrids offset by 8° (August), twenty-eight rhombs (the day), periods of 2.45s / 8s / 17s / 28s, and a hue seed of 2026 mod 360 = 226°.

View = D₁₇(P₅ ⊕ P₅∘R_8°) + φ-spiral₂₈ + Lissajous_3:5
N = 360/θ, θ = 360°/17 · pentagrid dual ≈ Penrose · golden angle 137.508°

Pentagrid — de Bruijn’s five-direction bar grid; its dual is a Penrose rhomb tiling. Two copies, one rotated 8°, produce a moiré no stock kaleidoscope generates.
7∶11 veil — coprime repeating conic gradients (360/7 and 360/11). The beat period is 77 units; neither factor shares 17.
Golden rhombs — diagonal ratio φ, planted on the golden angle 360°/φ², count = 28.
Lissajous 3∶5 — CSS @property --t driving cos(3t), sin(5t). Falls back to circular orbits where trigonometric transforms are unavailable.

Medium: HTML + CSS. Motion pause honors prefers-reduced-motion. Pointer tilt is for fine pointers only so phones keep scrolling. Theme toggle still works; the vitrine stays a dark well, like a gallery case.