Waveform styles

waveformStyle picks how the peaks are painted onto the canvas. Six renderers ship in the box; each one seeds its own bar sizing (see the geometry notes) so it looks right with zero tuning.

Set it in markup with data-waveform-style or on the constructor as waveformStyle. Every player below is live — press play, seek, and toggle this site’s light/dark switch to see the theme tokens follow.

mirror (default)

A SoundCloud-style symmetrical waveform, reflected around the centre line. The default, and the most legible at small heights.

bars

Classic vertical bars drawn from the baseline up — the familiar “audio editor” look. Tighter default spacing than mirror.

line

A smooth oscilloscope-style wave — a single continuous stroke instead of discrete bars. Best for ambient or sustained material.

blocks

Segmented LED-meter blocks — each bar is quantised into stacked cells for a retro hardware-meter feel.

dots

Circular points instead of bars — a lighter, more graphic treatment that reads well in dense grids.

seekbar

No waveform at all — just a rounded progress track. The lightest option, ideal when you want playback control without the visualization (or have no peaks to draw).

Tip

Style aliases are accepted: bar → bars, block → blocks, dot → dots. Unknown values fall back to bars.