...
Type | Usage | Image |
|---|---|---|
Linear progress indicators display process by visualizing an indicator increasing in width from 0 to 100% of a track. This is animated in sync with the process’s progress. The behaviour of the indicator is dependent on whether the progress of a process is known. They can be applied to the entire page, large containers and to form elements. | 
| |
Circular progress indicators display progress by animating an indicator along a circular track in a clockwise direction. The behaviour of the indicator is dependent on whether the progress of a process is known. They can be applied directly to a surface, such as a button or card. | 
|
Usage & Behaviour
Progress indicators inform users about the status of ongoing processes, such as loading a page, submitting a form, or saving updates. They communicate an applications state and indicate available actions, such as whether users can navigate away from the current screen.
...