yarn add @smashing/button

Default appearance

<Button>Default</Button>
<Button intent="info">Info</Button>
<Button intent="success">Success</Button>
<Button intent="warning">Warning</Button>
<Button intent="danger">Danger</Button>
Primary appearance

<Button appearance="primary">Default</Button>
<Button appearance="primary" intent="info">
Info
</Button>
<Button appearance="primary" intent="success">
Success
</Button>
<Button appearance="primary" intent="warning">
Warning
</Button>
<Button appearance="primary" intent="danger">
Danger
</Button>
Subtle appearance

<Button appearance="subtle">Default</Button>
<Button appearance="subtle" intent="info">
Info
</Button>
<Button appearance="subtle" intent="success">
Success
</Button>
<Button appearance="subtle" intent="warning">
Warning
</Button>
<Button appearance="subtle" intent="danger">
Danger
</Button>
Flat appearance

<Button appearance="flat">Default</Button>
<Button appearance="flat" intent="info">
Info
</Button>
<Button appearance="flat" intent="success">
Success
</Button>
<Button appearance="flat" intent="warning">
Warning
</Button>
<Button appearance="flat" intent="danger">
Danger
</Button>
Minimal appearance

<Button appearance="minimal">Default</Button>
<Button appearance="minimal" intent="info">
Info
</Button>
<Button appearance="minimal" intent="success">
Success
</Button>
<Button appearance="minimal" intent="warning">
Warning
</Button>
<Button appearance="minimal" intent="danger">
Danger
</Button>
Height

<Button height={64}>Default</Button>
<Button height={48} intent="info">
Info
</Button>
<Button height={32} intent="success">
Success
</Button>
<Button height={24} intent="warning">
Warning
</Button>
<Button height={20} intent="danger">
Danger
</Button>
Border radius

<Button borderRadius={30}>Default</Button>
<Button borderRadius={30} intent="info">
Info
</Button>
<Button borderRadius={30} intent="success">
Success
</Button>
<Button borderRadius={30} intent="warning">
Warning
</Button>
<Button borderRadius={30} intent="danger">
Danger
</Button>