# Audio

**Audio** allows you to integrate sound files into your content, providing an auditory learning experience. Configure the audio player appearance to match your design aesthetic while ensuring clear playback controls.

## Style settings

<table><thead><tr><th width="198">Property</th><th>Description</th></tr></thead><tbody><tr><td><strong>Player</strong></td><td></td></tr><tr><td>Background color</td><td>Select the background color for the audio player container. </td></tr><tr><td>Icon color</td><td>Set the color for playback control icons. </td></tr><tr><td>Active captions icon</td><td>Choose the color for the captions button when active. </td></tr><tr><td>Timeline (background)</td><td>Set the color for the unfilled portion of the playback progress bar. </td></tr><tr><td>Timeline (completed)</td><td>Set the color for the filled portion of the playback progress bar. </td></tr><tr><td><strong>Border</strong></td><td></td></tr><tr><td>Rounding</td><td>Adjust the slider to control corner roundness of the player.</td></tr><tr><td>Display border</td><td>Toggle (<strong>Yes</strong>/<strong>No</strong>) to add or remove borders around the player.</td></tr><tr><td>Border color</td><td>Select the color for the player border. </td></tr><tr><td>Thickness</td><td>Adjust the slider to control border thickness. </td></tr><tr><td>Player shadow</td><td><p>Add and configure shadow effects for the player:</p><ol><li>Click the "+" icon to add shadow effects.</li><li>Select from shadow styles: <strong>None</strong>, <strong>Soft</strong>, <strong>Regular</strong>, or <strong>Retro</strong>.</li></ol></td></tr></tbody></table>

## Typography settings

Customize **Audio** appearance using rich-text formatting options. These changes apply only to the **Player** and **Timeline** within the **Audio** element and do not affect other text elements.&#x20;

Typography settings for both the **Player** and **Timeline** can be configured with:

* Font
* Style
* Size
* Line spacing
* Color

For details, see [Typography and fonts](/branding/create-branding/typography-and-fonts.md).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.parta.io/branding/create-branding/elements/audio.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.