Tailwind CSS Progress - Props

The following props are available for progress component. These are the custom props that come with we've added for the progress component and you can use all the other native props as well.

Attribute Type Description Default
variantVariant Change progress variant filled
colorColor Change progress color blue
labelstring Add label for progress bar ""
valuenumber Add the completed percentage for progress bar 0

Types - Variant

type variant = "filled" | "gradient"
      

Types - Color

type variant = 
    | "blue-gray"
    | "gray"
    | "brown"
    | "deep-orange"
    | "orange"
    | "amber"
    | "yellow"
    | "lime"
    | "light-blue"
    | "blue"
    | "teal"
    | "cyan"
    | "light-blue"
    | "blue"
    | "indigo"
    | "deep-purple"
    | "purple"
    | "pink"
    | "red"