Skip to main content
Audio renders an HTML5 <audio> element. Supports dynamic URLs via {{ field }} interpolation.

​
Basic Usage

Controls are shown by default. The first positional argument is src.

​
Playback Options

Looping background audio
from prefab_ui.components import Audio

Audio(
    src="https://example.com/ambient.mp3",
    loop=True,
    controls=False,
    autoplay=True,
    muted=True,
)

​
API Reference

Audio Parameters

​
src
str
required
Audio URL.
​
controls
bool
default:"True"
Show playback controls.
​
autoplay
bool
default:"False"
Auto-start playback. Requires muted=True in most browsers.
​
loop
bool
default:"False"
Loop playback.
​
muted
bool
default:"False"
Mute audio.
​
css_class
str | None
default:"None"
Additional Tailwind CSS classes.

​
Protocol Reference

Audio
{
  "type": "Audio",
  "src": "string (required)",
  "controls?": true,
  "autoplay?": false,
  "loop?": false,
  "muted?": false,
  "cssClass?": "string"
}
For the complete protocol schema, see Audio.