Skip to content

Spectrogram

Two spectrograms scrolling left as a song plays: kicks as columns at the bottom, chords as bright lines

ui.audio.Spectrogram(magnitudes=engine.spectrum(512), history=160, colors="magma")

Every render that receives a new magnitudes list adds a column on the right; redrawing for any other reason (a hover, another widget) does not, so the speed follows your updates. It keeps the last history columns.

Loudness is quantized into levels colors and every cell of one color is drawn in a single shape, so even 160 columns × 64 bands stay cheap to draw.

Property Default What it does
magnitudes () dB per frequency bin (like node.spectrum()).
width, height 360, 140 Size in pixels.
history 120 Columns kept.
bands 48 Rows (log-spaced bands).
min_db, max_db -90, 0 Range of the colors.
colors, levels "magma", 24 Palette and how many color steps.
sample_rate, spacing 48000, "log" Like Spectrum: how the bins are spaced.