Strata components
Every Strata component, from buttons to tables, dialogs and toasts, in one design language that CSS draws flat and the GPU lights in 3D.
The live examples need JavaScript. Underglass home ยท Source on GitHub
Examples
- Postcard studio: Design a postcard with real inputs, radio swatches and stamps. One native React form edits the GPU-presented card.
- Card deck: Deal, stack, fan and shuffle four layer cards with staggered GPU motion. Like a card mid-flight: its button stays native.
- Shader lab: Chain ripple, chromatic, dissolve and a custom WGSL aurora on decorative artwork, with native sliders for every parameter.
- Notification stack: Send notifications that slide in and out with Presence while their Dismiss buttons remain ordinary React buttons.
- Small tasks, real controls: Try the maintained task app: create, search and edit local tasks with native inputs and a detail view.
- Webcam pond: See yourself reflected in a koi pond. The koi are plain HTML spans, refracted by GPU water. Feed them from a native lily pad.
- Fluent release board: Stock Fluent UI v9 components that burn away, materialise and take a hit on the GPU, and still work as real controls. Throw cards between lanes on spring physics.
- GPU or CSS?: Six jobs done twice, side by side: the best CSS technique on the left, Underglass on the right, with a frame meter. One of them is a job where CSS wins.
- Strata components: Every Strata component, from buttons to tables, dialogs and toasts, in one design language that CSS draws flat and the GPU lights in 3D.
- Instrument gallery: Every Instrument component as hardware: knobs, faders, switches, lamps, meters, a jog wheel and a patch bay, plus a synthesiser voice that is wired like the real thing.