React SDK


The Button component is used to trigger an action or event, such as submitting a form, opening a modal.


Editable Example


Use the size prop to change the size of the button. You can set the value to xs, sm, md, lg or xl.

Editable Example



Use the appearance prop to change the visual style of the Button. You can set the value to default, primary, link, or subtle-link.

Editable Example

Buttons can be used as links.

Editable Example

Disabled state

Pass disabled prop to the Button component to disable it's functionality. This will disable the buttons default functionality and dim it's appearance.

Editable Example


  • Button has role button.
  • When Button has focus, Space and Enter activates it.


The Button composes the Box component so you can pass props for Box. These are props related to the Button component.

aria-labelstringThe label of the button.
appearancedefault, primary, link, subtle-link, nonedefaultThe variant of the button style to use.
disabledbooleanIf true, the button will be disabled.
loadingbooleanIf true, the button will show a spinner.
loadingTextstringThe label to show in the button when loading is true. If no text is passed, it only shows the spinner.
sizexs, sm, md, lg , xlmdThe size of the button.
asstringbuttonHTML element or custom component.