Progress

A linear progress indicator.

Usage

import { Progress } from '@epilot/spark-ui/progress'
<Progress value={62} />

Examples

Sizes

With label

Combine with a heading and text for a clear, labelled gauge.

Battery78%

Custom max

max defaults to 100. Set it explicitly to track progress towards any total.

API Reference

PropTypeDefault
valuenumber
maxnumber100
size"sm" | "default" | "lg""default"

The component sets role="progressbar" and the matching aria-valuemin, aria-valuemax, and aria-valuenow attributes.

On this page