Minimal live audio skin
Compact live audio controls for playback, live-edge state, volume, and feedback
Use it for a compact live audio player.
Use the packaged preset
<script type="module">
import '@videojs/html/live-audio/player';
import '@videojs/html/live-audio/minimal-skin';
import '@videojs/html/media/hls-audio';
</script>
<live-audio-player>
<live-audio-minimal-skin>
<hls-audio src="https://example.com/live.m3u8" crossorigin="anonymous"></hls-audio>
</live-audio-minimal-skin>
</live-audio-player>Customize the skin
Packaged skins support --media-accent-color, --media-accent-text-color,--media-border-radius, and --media-scale-unit. Add your own class name and style values to the skin root.
See Customize skins for the complete styling and ownership workflow.
Behavior and API
- The packaged export is
MinimalLiveAudioSkinin React and<live-audio-minimal-skin>in HTML. - The live preset replaces on-demand time controls with live-edge state.
- Minimal keeps the same feature family in a smaller responsive layout.
For player state and feature details, see Presets. For the UI building blocks, see UI components.