The number 9, written by itself in infinite mathematics.
A WebGL scene draws a giant figure 9 out of hundreds of individually rendered equations — and every single one of them evaluates to 9. Hover any tile to freeze it and read its full proof, step by step, typeset in LaTeX. Equations continuously erase and rewrite themselves, cycling through twelve branches of mathematics:
Arithmetic · Algebra · Logarithms & exponentials · Trigonometry · Derivatives · Integrals · Limits · Series · Number theory · Special functions · Linear algebra · Self-referential
- Equation generator (
src/mathGen.ts) — procedurally builds identities that resolve to 9, each with machine-generated proof steps and a complexity score. Difficulty phases shift the category mix from simple arithmetic toward integrals, series, and special functions as the scene evolves. - LaTeX → texture pipeline — every equation is typeset by MathJax to SVG, rasterized to a canvas at device pixel ratio, and uploaded as a
THREE.CanvasTexture, with a render cache so repeated expressions cost nothing. - The silhouette — tiles are sampled onto a "9" silhouette and animated with handwriting-style write/erase phases (
src/animatingTile.ts), composited with UnrealBloom for the glow. - Proof panel — hovering a tile pauses it and opens its proof, re-typeset live by MathJax.
- Sound engine (
src/soundEngine.ts) — subtle generative audio tied to the writing animation; toggleable. - Adjustable quality level (tile count) for slower machines.
Requires Node.js 18+.
npm install
npm run devTo open: use Google AI Studio link or open on localhost. No API keys or backend required — everything is generated client-side.
npm run build # production build → dist/
npm run lint # typecheck (tsc --noEmit)