A working preview of the inline widget primitives.
Inline kbd & readouts
Press ⌘ K to open search, then ↵ to confirm. While running, the simulator publishes 42 and 128 to the panel.
You can stamp things inline: REV A or LIVE or DRAFT.
Sparkbar — server load leaderboard
Framed figure — chrome only
Stepper — TCP handshake
Spec list — frontmatter as a grid
Line chart — p50 / p95 / p99 latency
Histogram — latency distribution
Live simulator — random walk
Knobs panel — playground
Protocol diagrams — RFC bit-fields
The packet diagrams in network RFCs (the +-+-+-+- ASCII art kind) tell you exactly which bits go where. Here they are rendered. Click a chip to switch protocols; hover a field for the detail.
Live patcher — pdrs
pdrs is Pure Data rebuilt for the browser: a realtime DSP + control engine written in Rust, compiled to WebAssembly and run inside an AudioWorklet, with a canvas editor wired live. The patch below is the real engine running a classic example — pulse-width modulation, built by subtracting two sawtooth (phasor~) waves whose frequencies differ by a fifth of a Hz. Because their phase relationship drifts continuously, the pulse width is never the same twice.
The three graphs are live oscilloscopes — the engine is writing the two sawtooths and their difference into arrays every block and the canvas redraws them each frame, so you can watch the pulse width breathe. Click for sound, drag a box to move it, drag an outlet to an inlet to rewire, or click a cord and press ⌫ to cut. (output~’s volume starts at zero — nudge it up to hear the 50 Hz pulse.)