Interactive playground for the full component set

Tune the player live, then drop the exact configuration into your app.

Adjust video and audio settings side-by-side, test the control surface, and see how the player responds with poster, download, preview, shortcut, and waveform features turned on or off.

Live config editingVideo and audio presetsControl exclusion menusColor customization

What to try first

Toggle the most visible features first to get a feel for the component’s behavior.

Accent color
Customize the primary color
Controls
Show or hide specific controls
Shortcuts
Enable or disable keyboard shortcuts
Download button
Toggle the download option for media

Video Player

Resize the visible controls, change sources, toggle poster handling, and see how the player reacts.

#60a5fa

Audio Player

Use this to test the waveform path, fallback audio element, downloads, and keyboard shortcuts.

#60a5fa