Progress

Visual indicator that shows the progression of a task or process, such as loading, file transfer, installation, or submitting. It provides users with real-time feedback, helping manage expectations and improve the overall experience.

  • Provides context for assistive technology to read the progress of a task

  • Circular progress indicator

  • Customizable styles

  • Animated indeterminate state

0%

Installation

Loading...

Usage

<Progress />

<ProgressBar />

<ProgressCircle />

Examples

Indeterminate

Circle

This component is experimental and may change in the future.

Label

0%

Custom Styles

API Reference

Progress

Support all Radix Root API

ProgressBar

Alias for Progress.

ProgressCircle

PropTypeDefault
strokeWidth
number
2

Support all Radix Root API