Button

Button lets the user perform an action.

Read more about this component in the Aksel documentation.

All extra props are passed to the root element.

Properties

PropertyDescriptionDefault
Control
Properties
as

Element to render

"button" "a"
"button"
disabled

Avoid using if possible for accessibility purposes.

Prevent the user from interacting with the button: it cannot be pressed or focused.

boolean null
false
href

URL to navigate to. Required when as is set to "a".

string
-
icon

Button icon

Snippet Component
-
iconPosition

Button icon position

"left" "right"
"left"
loading

Replaces button content with a Loader component, keeps width.

boolean
false
ref
bindable

Ref is the button element. Bind to this to obtain the button element.

Element
-
size

Changes padding, height, and font-size.

"medium" "small" "xsmall"
"medium"
variant

Changes design and interaction-visuals.

"primary" "primary-neutral" "secondary" "secondary-neutral" "tertiary" "tertiary-neutral" "danger"
"primary"
Snippets
children

Content of the button

 -
icon

Button icon

 -

Properties included from: HTMLButtonAttributes, HTMLAnchorAttributes