ProgressSpinner

ProgressSpinner is a process status indicator.


import { ProgressSpinner } from 'primereact/progressspinner';
         

An infinite spin animation is displayed by default.


<ProgressSpinner />
         

ProgressSpinner can be customized with styling property like style, strokeWidth and fill.


<ProgressSpinner style={{width: '50px', height: '50px'}} strokeWidth="8" fill="var(--surface-ground)" animationDuration=".5s" />
         

Following is the list of structural style classes, for theming classes visit theming page.

NameElement
p-progress-spinnerContainer element.
p-progress-circleSVG element.
p-progress-pathCircle element.
Accessibility guide documents the specification of this component based on WCAG guidelines, the implementation is in progress.

Screen Reader

ProgressSpinner components uses progressbar role. Value to describe the component can be defined using aria-labelledby and aria-label props.


<ProgressSpinner aria-label="Loading" />
 

Keyboard Support

Component does not include any interactive elements.