ProgressBar

ProgressBar can be used to show a progress of an ongoing operation. Similar to Button, it accepts variant and size props.

size: "sm", variant: "primary"

10%

size: "md", variant: "primary"

10%

size: "lg", variant: "primary"

10%

size: "sm", variant: "secondary"

20%

size: "md", variant: "secondary"

20%

size: "lg", variant: "secondary"

20%

size: "sm", variant: "success"

30%

size: "md", variant: "success"

30%

size: "lg", variant: "success"

30%

size: "sm", variant: "error"

40%

size: "md", variant: "error"

40%

size: "lg", variant: "error"

40%

size: "sm", variant: "warning"

50%

size: "md", variant: "warning"

50%

size: "lg", variant: "warning"

50%

Indeterminate ProgressBar

An indeterminate ProgressBar can be used for operation that has no known progress number. Pass indeterminate prop to the ProgressBar to create one.