Real-time audio spectrum, on the GPU
A high-performance, WebGL-based audio spectrum analyzer and FFT visualizer for the web —
a framework-agnostic TypeScript core with a first-class Vue 3 component. Visualize the
microphone, tab/system audio, a WebSocket stream, or your own data — the entire frame
drawn by a single fragment shader.
Want every knob? Open the full playground →
Why FFT Visualizer
Single-draw-call WebGL
Every bar, LED segment, gradient, glow and reflection is rendered by one fragment
shader — smooth at 120fps with 80 bands in stereo.
Three data sources
Capture audio locally (mic or tab/system), stream pre-computed FFT over WebSocket,
or feed your own magnitudes via props.
In-browser FFT (Rust/WASM)
Optional WebAssembly FFT processor, lazy-loaded only when you capture audio locally.
Zero backend required.
Rich visual modes
LED segments, radial layout, stereo, mirrored reflection, glow, rotation, and 10
gradient presets or your own CSS-color stops.
Framework-agnostic core
A vanilla-TypeScript engine with thin wrappers — Vue today, React next. Rendering uses
native WebGL: no charting library, no canvas 2D.
Transparent & themeable
Any background color, including a fully transparent canvas that blends into your
page. SSR-safe for Nuxt.