Progress

Linear progress bar.

import { Progress } from "@/rl-ui";

<Progress value={42} />

Examples

import { Progress } from "@/rl-ui";

<>
<Progress value={15} />
<Progress value={50} />
<Progress value={90} />
</>

import { Progress } from "@/rl-ui";

<Progress indeterminate />

Prop	Type	Default	Description
`value`	`number`	0	Current progress.
`max`	`number`	100	Maximum value.
`indeterminate`	`boolean`	false	Animated unknown progress.
`color`	`string`	—	Indicator color.
`backgroundColor`	`string`	—	Track color.
`height`	`string \| number`	"h-2"	Bar height.
`width`	`string \| number`	"w-full"	Bar width.

On This Page