Live Canvas (3D)
An AI-configurable Three.js / WebGL2 3D hero, managed from the admin and gated behind the threeD flag.
threeD adds a Live Canvas — an interactive Three.js (WebGL2) 3D hero on the storefront, configurable from the admin without writing shader code.
Enable & configure
threeD in /admin/features (runtime)./admin/three-d — or let the AI assistant set it via the three.configure tool.The scene reads the shop's theme palette so it matches your brand. With the flag off, the storefront renders its normal (non-3D) hero — byte-identical to before.
| Flag | threeD |
| Tier | runtime |
| Default | off |
| Admin | /admin/three-d |
| Tools | three.get, three.configure |
WebGL2 only — browsers without it fall back to the standard hero. Keep an eye on Core Web Vitals when enabling a heavy scene.
Agent Optimization
The design system is optimized for AI agents end to end — they can read it (registry + schemas), build with it (the builder tools), and cite it (Schema.org JSON-LD).
Motion & Effects
A flag-gated layer of modern CSS scroll-driven animations, an animated palette-adaptive aurora gradient, and a per-section motion vocabulary the builder can assign. Compositor-thread, no JS jank, default-off.