Zooxanthella is an interactive reef time-lapse for anyone who has heard the word bleaching without watching it happen. A single coral colony accretes polyp by polyp across simulated centuries; warm the lagoon past 29.5 °C and it blanches, honestly, then reseeds its algae if you cool it. The page has one job: make a slow, invisible catastrophe legible in fifteen seconds.
Nothing here is decorative. The teal is the lagoon; the coral and gold are the two pigments a healthy polyp carries; the white is what's left when the algae leave. The whole bleaching effect is a single interpolation between coral-plus-gold and this bone white.
The reef is a real agent simulation on a single canvas 2D context — no images, no video, no WebGL, no libraries beyond the two webfonts. It grows from a handful of larvae seeded on the substrate. Each is a branch with a living tip; on every growth tick the tip deposits one tapered segment of skeleton, wanders slightly with an upward light-bias, and occasionally buds a daughter branch — a stochastic L-system that produces staghorn structure without ever repeating.
Colour is a separate, per-segment quantity: a symbiont density from 0 to 1. Temperature sets an algal carrying-capacity; each frame every segment eases toward it, but asymmetrically — pigment leaves roughly eight times faster than it returns, exactly as on a real reef. Tips carry a higher heat-sensitivity, so blanching starts at the growing edges and spreads inward. Sustained severe heat marks tissue dead; dead tissue only ever recolonises to a muted forty percent, so a scorched reef never quite comes all the way back. Rendering just lerps each segment between bone-white and coral by its own symbiont value — so the bleach is emergent, not a scripted colour swap. Growth halts whenever colony health drops below forty percent: a bleached reef stops calcifying, and resumes only once you cool the water.
Discipline around it: everything else is quiet. A diel clock breathes the whole colony and extends polyp tentacles at night; five caustic bands ripple at the surface; a warm vignette creeps in above 29 °C. The canvas caps device-pixel-ratio at 2, resizes to its container, clamps its frame delta, and parks the animation loop entirely when the tab is hidden. Under prefers-reduced-motion it fast-forwards to a mature colony and paints one settled frame — the slider still bleaches and heals it, event-driven, with no running loop.