Buttons are an essential part of any application. Buttons can have different radius factors using the rounded prop.

Buttons can have a smaller size. Use the size prop to change the size of a button.

Buttons can be rendered as links. Use the to prop to set the link target url.

Buttons can have a glowing badge indicator. Use the badge prop to add a badge to your buttons.

Buttons can have solid background colors. Use the variant="solid" prop and the color prop to make solid buttons.

Buttons can have pastel background colors. Use the variant="pastel" prop and the color prop to make pastel buttons.

Buttons can have outline background colors. Use the variant="outline" prop and the color prop to make outline buttons.

Buttons can have icons, both on the left and on the right. Use the Icon component inside the button slot to render the icon you need.

Buttons can have a flat shadow. Use the shadow="flat" prop to add shadows to your buttons.

Buttons can have a hover shadow. Use the shadow="hover" prop to add shadows to your buttons.

Buttons can be shown in a loading state. Use the loading prop to show a loading indicator.

Buttons can be shown in a disabled state. Use the disabled prop to disable the button.

Buttons can be grouped together. Use them inside a BaseButtonGroup component.