Progress steps

Progress lists in Base are used to denote staged progress of an action or activity. This list type provides the user with a sense of awareness around progress and the steps remaining.

Examples

Progress Steps Dotted Usage
Create Account
Here is some step content
Verify Payment
Add Payment Method
Progress Steps Numbered Usage
1
Create Account
Here is some step content
2
Verify Payment
3
Add Payment Method

Overrides

Additionally, you can fully customize any part of the ProgressSteps through the overrides prop. The ProgressSteps consists of multiple sub-components that are listed bellow and you can override each one of them. To help you identify the names of these sub-components, you can highlight them through this selector:

Step 1
Content
Step 2
Check
Step 1
2
Step 2
Content