Primary button
<Button>Primary</Button>
<Button hasArrow={true}>Primary</Button>Secondary button
<Button type="secondary">Secondary</Button>
<Button type="secondary" hasArrow={true}>Secondary</Button>Call to action button
<Button type="action">Call to action</Button>List buttons
Regular
<Button type="list">List regular</Button>Highlighted
<Button type="highlight">List highlight</Button>Load more button
<Button type="load-more" size="small">Load more</Button>Dark mode buttons
<Button type="secondary-dark">Secondary Dark</Button>
<Button type="secondary-dark" hasArrow={true}>Secondary Dark</Button>Modifier class property
The modifier class property should only be used for layout purposes, and not to alter the buttons visuals.
<Button hasArrow={true} modifierClass="modifier-class">Primary</Button>