GitHubnpm

Accent theme

Base radius

GitHubnpm

Accent theme

Base radius

Colour scheme

Docs menu

Guides


Primitives
Forms
Layout
Feedback
Overlays
Navigation
Data Display
AI

Progress

A real <progress>. It reports its own value to assistive tech without any role="progressbar"/aria-valuenow bookkeeping, and becomes an indeterminate spinner for free when you omit value.

Playground

Toggle every adjustable prop and watch the component — and the code — update live.

Unstyled

Same component — Kernel look stripped. See Platforms.

indeterminate
Usage
<Progress value={60} label="Uploading" />

Props

Props for Progress.
PropTypeDefault
valuenumber
maxnumber100
labelstring

Styling the fill has no standardised, non-vendor-prefixed API yet.::-webkit-progress-value and::-moz-progress-bar are the correct, current way to do it, not a legacy fallback.