Real-time audio spectrum, on the GPU

A high-performance, WebGL-based audio spectrum analyzer and FFT visualizer for Vue 3. 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.
    One peer dependency
    Just Vue 3. 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.
Copyright © 2026