Tailwind CSS Button - Props

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

Attribute Type Description Default
variant Variant Change button variant filled
size Size Change button size md
color Color Change button color blue
full-width boolean Change button to a block level element false
ripple Ripple Add ripple effect for button ''

Types - Variant 

type variant = "filled" | "outlined" | "gradient" | "text"

Types - Size 

type size = "sm" | "md" | "lg"

Types - Ripple 

type ripple = "light" | "dark"

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 button component.