Button canon

Every button in the wild, rendered from the real primitive. Hover to see the energize. Approve the canonical row; the rest retire or fold in. Verdicts are my recommendation — yours overrides.

A · Canonical primitive — boas-kit.css .btn

Corner-Bracket Console: no full border · blue corner ticks ↔ red halftone fill · mono uppercase. Hover = brackets push out + edge energizes (#edgeHot). The only button primitives boas-kit defines.

.btn — primarykeep · canonical

.btn--inv — inverse polekeep · secondary emphasis

.btn[disabled]keep · inactive

B · Surface-local extensions — NOT in boas-kit (defined inline in /p, /m)

These exist in shipped surfaces but are not in the primitive file. Decision: promote into boas-kit as canonical variants, or drop.

.btn--ghost — outline, no fillpromote? → secondary

.btn--danger — red ticks, no fillpromote? → destructive

C · Competitors — other primaries in the wild (retire candidates)

Different primary treatments on other surfaces. boas-kit says the plain single-fill button is RETIRED. Email pill is the mail-tier echo (feTurbulence can't run in mail).

portal 07-01 — solid fillretire → .btn

portal 07-01 — outline= .btn--ghost?

[ Open meeting page ]email tier — bracketed pillemail-only echo

D · Non-buttons (for boundary) — text link + tag

Tertiary / nav = a plain link, never a button. Chips/tags are labels, not actions.

← Back to the proposed timenav linkkeep · tertiary

verified contact.chip — tagkeep · not a button