logo

Button

Buttons allow users to take actions, and make choices, with a single tap.

Usage

Variants

Use the variant prop to change the visual style of the Button.

Colors

Use the color prop to change the color of the Button.

Sizes

Use the size prop to change the size of the Button.

Disabled

Use the isDisabled prop to disabled the Button.

With Icons and Lable

You can add icons to the Button by passing the startContent or endContent props.

Icon Button

Use the isIconOnly prop to display an icon without text on the Button.

Loading

Use the isLoading prop to display a loading indicator on the Button.