Button

Overview

When to use

The icon element should be used if there is no room for a full descriptive text label or if a general function could be described with a familiar, abstract image.

When to consider an alternative

If the mapped function is too complex to find a widely recognized and descriptive image to sell its use. Or if the icon has only a decorative character.

Component

The button component should always be used if the user has to be guided to specific actions. It's important to use the button component with care. Especially the primary button should be used as less as possible, so the page has a clear CTA for an explicit user journey.

Default

Primary

Invert

Link

Flag

Disabled

Small

Icon right

Icon left

Icon Only

Loading

Properties

Property	Type	Required	Default
primary	Bool	false	-
link	Bool	false	-
href	String	false	-
invert	Bool	false	-
loading	Bool	false	-
icon	String	false	-
iconLeft	Bool	false	-
disabled	Bool	false	-
flag	String	false	-
toggle	String	false	-
small	Bool	false	-
iconOnly	Bool	false	-
utilClassNames	String	false	-
children	Node	false	-
onClick	Func	false	-