# Progress bar

**Progress bar** provides visual feedback on completion status, allowing learners to track their advancement through course content. 

## Style settings

<table><thead><tr><th width="228">Property</th><th>Description</th></tr></thead><tbody><tr><td>Progress line (background)</td><td>Set the color for the unfilled portion of the bar</td></tr><tr><td>Progress line (completed)</td><td>Define the color for the filled portion showing completion</td></tr><tr><td>Rounding</td><td>Adjust corner radius of the progress bar</td></tr><tr><td>Display border</td><td>Toggle border visibility around the bar (Yes/No)</td></tr><tr><td>Border color</td><td>Set the color for the border around the progress bar</td></tr><tr><td>Thickness</td><td>Adjust border thickness</td></tr><tr><td>Margin from text</td><td>Set spacing between the progress bar and percentage text</td></tr><tr><td>Progress shadow</td><td><p>Add and configure shadow effects for the progress bar:</p><ol><li>Click the "+" icon to add shadow effects.</li><li>Select from shadow styles: None, Soft, Regular, or Retro.</li></ol></td></tr></tbody></table>

## Typography settings

Use Rich-text on the Typography tab to apply specific formatting to the text within the **Progress bar**. Changes made here affect only the text in the **Progress bar** element:

* Basic
* Headings
* Caption
* List
* Quote
* Link

For details on how to configure parameters in rich-text options, see [Typography and fonts](https://help.parta.io/branding/create-branding/typography-and-fonts).