Kairoz
.kairoz-btn

Button

28px action element in primary, secondary, ghost, and destructive variants. Near-white primary for CTAs, ghost for tertiary actions. Blue is reserved for focus and selection, not CTAs.

.kairoz-btn.kairoz-btn-primary.kairoz-btn-secondary.kairoz-btn-ghost.kairoz-btn-destructive.kairoz-btn-icon.kairoz-btn-sm.kairoz-btn-lg

Default

<button class="kairoz-btn kairoz-btn-primary">Ship it</button>

Variants

Primary
Secondary
Ghost
Destructive
Icon
Small
Large

Icon-paired

<button class="kairoz-btn kairoz-btn-primary"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M12 5v14M5 12h14"/></svg> New project</button>