New — hover-time tooltips & auto-highlighting markers in WaveformPlayer 1.16. What's new →

Builder

Build your player.

Tweak the options, watch it update live, then copy the markup for HTML, JavaScript or React.

Options

Style Layout Button Height — 64px

Bar width — 2 Spacing — 2 Radius — 1

Custom colors

Title Artist

Markers

Time accepts m:ss or seconds. Leave the colour at its default to use the theme colour.

Tip: omit the attributes you leave at their defaults — they're only shown here so you can see everything.

Layout Density Cover position Bar position Cover size (px, 0 = auto) Thumbnail size (px, 0 = auto)

Continuous Show artist

Tracks

HTML

The playlist auto-initialises from [data-waveform-playlist] markup — load the core player first, no JS needed.

Free, open-source and ~10KB — add a div and go.

API reference, guides and recipes for all nine packages.

Configure a player visually and copy the HTML, JS or React.

MIT-licensed, open source, zero dependencies.