experiments · full source included
The Lab
Ten working flexes of the 2026 web platform — each one a different genre of website, each one shipping its complete source code to copy, download, and repurpose in future builds.
AI video · scroll scrubbing
Scroll Cinematic
AI-generated film scrubbed frame-by-frame by the scrollbar
run experiment →
WebGPU · shaders
Aurora Engine
Raw WebGPU (WGSL) with automatic WebGL2 (GLSL) fallback
run experiment →
CSS scroll-driven animations
Scroll Cinema
animation-timeline: view() / scroll() — zero JavaScript motion
run experiment →
View Transitions API
Morph Gallery
document.startViewTransition() + view-transition-name morphs
run experiment →
CSS anchor positioning + Popover API
Constellation Map
anchor-name / position-area / position-try + popover attribute
run experiment →
CSS Overflow 5 carousels
Zero-JS Carousel
::scroll-button() + ::scroll-marker() pseudo-elements
run experiment →
Web Audio API
Sigil Synth
Oscillator graph → filter → delay → analyser visualization
run experiment →
Canvas simulation
Ink Cloth
Verlet integration + constraint relaxation, from scratch
run experiment →
Modern CSS (@property · oklch)
Living Typography
Typed animatable custom properties + perceptual color
run experiment →
UI pattern · React state
Terminal Oracle
Command parsing, history, typewriter streaming
run experiment →
The 2026 skills codex
Everything in this Lab leans on capabilities that reached the web platform recently: WebGPU (Baseline January 2026), CSS scroll-driven animations (Chrome, Edge, Safari 26), the View Transitions API (Baseline), CSS anchor positioning (all major browsers), ::scroll-button / ::scroll-marker carousels (Chrome 135+, Safari 18.2+), @property typed animations, oklch() color, corner-shape squircles and sibling-index(). Where support is still rolling out, every demo wraps the new tech in @supports so older browsers degrade gracefully instead of breaking. Steal these patterns freely — that's what they're here for.