# 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](https://help.parta.io/branding/create-branding/typography-and-fonts).