Tailwind CSS Alert - Props

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

Attribute Type Description Default
variant Variant Change alert variant filled
color Color Change alert color blue
dismissible boolean Makes alert dismissible false
animation boolean Change alert animation false
show boolean Change alert visibility true

Types - Variant 

type variant = "filled" | "gradient"

Types - Color 

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

Related

Examples

Checkout different examples for alert component.