# Button

**Buttons** provide interactive controls that enable users to navigate, submit forms, or take other actions. Configure button appearance to create clear visual cues for interactive elements in your content.

## Style settings

<table><thead><tr><th width="231">Property</th><th>Description</th></tr></thead><tbody><tr><td>"Start course" icon</td><td>Upload or select a custom icon from the library to appear alongside button text.</td></tr><tr><td><strong>Active button</strong></td><td></td></tr><tr><td>Background image</td><td>Upload a custom image to use as the button background instead of a solid color.</td></tr><tr><td>Background color<br></td><td>Set the color for active, clickable buttons.</td></tr><tr><td>Hover color</td><td>Specify the color that appears when users hover over an active button.</td></tr><tr><td><strong>Disabled button</strong></td><td></td></tr><tr><td>Background image</td><td>Upload a custom image to use as the background for inactive buttons.</td></tr><tr><td>Background color<br></td><td>Set the color for disabled buttons to visually indicate they are not currently interactive.</td></tr><tr><td><strong>Border</strong></td><td></td></tr><tr><td>Rounding</td><td>Adjust the slider to control corner roundness of buttons.</td></tr><tr><td>Display border</td><td>Toggle between "Yes" or "No" to add or remove borders around buttons.</td></tr><tr><td><strong>Effects</strong></td><td></td></tr><tr><td>Button shadow</td><td>Add shadow effects to buttons for additional visual depth and emphasis.</td></tr><tr><td><strong>Paddings</strong></td><td></td></tr><tr><td>Vertical</td><td>Set the internal padding above and below button text to control button height.</td></tr><tr><td>Horizontal<br></td><td>Set the internal padding to the left and right of button text to control button width.</td></tr></tbody></table>

## Typography settings

The Typography tab offers text formatting options for button states:

<table><thead><tr><th width="206">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Active button</td><td>Configure text appearance for interactive buttons: font, style, size, line spacing, and color.</td></tr><tr><td>Disabled button</td><td>Set text formatting for non-interactive buttons to provide appropriate visual feedback: font, style, size, line spacing, and color.</td></tr></tbody></table>

For details on how to configure each parameter, see [Typography and fonts](https://help.parta.io/branding/create-branding/typography-and-fonts).