ProgressBar is a process status indicator.
import ProgressSpinner from 'primevue/progressspinner';
An infinite spin animation is displayed by default.
<ProgressSpinner />
ProgressSpinner can be customized with styling property like style, strokeWidth fill and animationDuration.
<ProgressSpinner style="width: 50px; height: 50px" strokeWidth="8" fill="var(--surface-ground)"
animationDuration=".5s" aria-label="Custom ProgressSpinner" />
Following is the list of structural style classes, for theming classes visit theming page.
| Name | Element |
|---|---|
| p-progress-spinner | Container element. |
| p-progress-circle | SVG element. |
| p-progress-path | Circle element. |
ProgressSpinner components uses progressbar role. Value to describe the component can be defined using aria-labelledby and aria-label props.
<ProgressSpinner aria-label="Loading" />
Component does not include any interactive elements.