Button

The button component adds styles for actions in forms, dialogs, and more.

<button class="btn-primary">Primary</button>
<button class="btn-cta">CTA</button>
<button class="btn-outlined">Outlined</button>
<button class="btn-link">Link</button>

the btn class works on both <button> and <a> elements.

Buttons can come in two different sizes.

<button class="btn-primary">Normal</button>

<button class="btn-small">Small</button>

Sometimes buttons need to have an icon on them. This is where btn-icon comes into play by removing the margin.

<button class="btn-primary"><i class="ph ph-caret-down"> Menu</button>

<button class="btn-primary btn-icon"><i class="ph ph-caret-down""></button>