Buttons trigger actions or navigation when clicked. They communicate calls to action and allow users to interact with the interface.

Usage

Import and use the Button component:

<Button variant="default" size="default">
  Click me
</Button>

Variants

primary

Primary action button

secondary

Secondary action button

outline

Outlined button for less emphasis

ghost

Ghost button for subtle actions

link

Link-styled button

destructive

For destructive actions

Sizes

default

Default size

sm

Small size

lg

Large size

icon

Icon button

Props

Name

Type

Default

Description

variant

string

'default'

Visual style of the button

size

string

'default'

Size of the button

disabled

boolean

false

Whether the button is disabled

Button