The following props are available for progress bar component. These are the custom props that come with we've added for the progress bar component and you can use all the other native props as well.
Attribute | Type | Description | Default |
---|---|---|---|
variant | Variant | Change progress bar variant | filled |
color | Color | Change progress bar color | blue |
label | label | Add label for progress bar | undefined |
value | number | Add the completed percentage for progress bar | 0 |
barProps | object | Add custom props for progress bar percentage bar | undefined |
className | string | Add custom className for progress bar | '' |
import type { ProgressProps } from "@material-tailwind/react";
type variant = "filled" | "gradient";
type color =
| "blue-gray"
| "gray"
| "brown"
| "deep-orange"
| "orange"
| "amber"
| "yellow"
| "lime"
| "light-green"
| "green"
| "teal"
| "cyan"
| "light-blue"
| "blue"
| "indigo"
| "deep-purple"
| "purple"
| "pink"
| "red";
type label = string | boolean;