Source: https://primeng.org/progressspinner

• Primary

  Surface

  PresetsAuraMaterialLaraNora

  Ripple

  RTL

• v20

  • v20

  • v19

  • v18

  • v17

• FEATURES

• API

• THEMING

• PASSTHROUGH

ProgressSpinner

ProgressSpinner is a process status indicator.

Import #

import { ProgressSpinnerModule } from 'primeng/progressspinner';

Basic #

An infinite spin animation is displayed by default.

<p-progress-spinner ariaLabel="loading" />

Custom #

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

<p-progress-spinner strokeWidth="8" fill="transparent" animationDuration=".5s" [style]="{ width: '50px', height: '50px' }" />

Accessibility #

Screen Reader

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

<p-progress-spinner aria-label="Loading"></p-progress-spinner>

Keyboard Support

Component does not include any interactive elements.

• Import

• Basic

• Custom

• Accessibility

Templates

Highly customizable application templates to get started in no time with style. Designed and implemented by PrimeTek.

PrimeNG 20.3.0 by PrimeTek