LABS
Interactive experiments & their source
A playground for the 3D, canvas and shader pieces scattered across this site — each one isolated as a live, tweakable demo with its source code in plain sight.
| 86K | 3d-css | 4 exp · 2,747 lines |
|---|---|---|
| 73K | hud | 4 exp · 2,632 lines |
| 43K | shaders | 3 exp · 1,341 lines |
| 2.6K | scroll | 1 exp · 91 lines |
| 38K | svg | 1 exp · 1,208 lines |
| 242K | total | 8,019 lines |
13 experiments · 41 files · 8,019 lines · 242K
3D CSS4 experiments · 2,747 lines
- 3D ComputerA retro computer workstation built entirely with CSS 3D transforms — no WebGL, just perspective and transform-style: preserve-3d.
- 3D Server RackA stacked server rack in CSS 3D with deterministic, seed-driven status LEDs — resize it, reseed it, spin it around.
- Holographic Project CardA project card with mouse-driven CSS 3D tilt, holographic sheen, and image+tag parallax layers — no WebGL.
- Split-Flap BoardA departure board in CSS 3D: every flap turns forward through its drum until it lands on its letter, four half-cards and two hinged leaves per character.
HUD4 experiments · 2,632 lines
- Glitch Signal MapA Canvas 2D signal grid with a per-cell state machine, pulsing accents and glitchy recalibration — throttled to 30fps.
- Cybernetic Glyph GridA Canvas 2D grid of hex pairs and glitch glyphs that pulse, flicker and re-randomize on a deterministic timer.
- Fake ConsoleA faux boot console that types out streaming log lines with a blinking caret and an auto-scrolling viewport.
- System Metrics PanelAn animated telemetry HUD with live-updating gauges and readouts, easing toward shifting target values.
Shaders3 experiments · 1,341 lines
- Film Grain ShaderProcedural multi-octave value-noise film grain in WebGL, supersampled to stay fine on high-DPI screens.
- Mesh GradientAn animated mesh-gradient background: three drifting colour blobs, a vignette and optional film grain, all in one fragment shader.
- ASCII RaymarcherA signed-distance scene raymarched once per character cell and printed as real text: each cell's brightness picks a Doto glyph from a ramp.
Scroll1 experiment · 91 lines
SVG1 experiment · 1,208 lines
18 directories