Proposal
Badge currently has two appearances: solid and subtle (www/src/registry/ui/badge/styles.ts). Many design systems (shadcn, Geist, Linear) also ship an outline badge — transparent background, 1px border, muted foreground.
Came up while implementing the landing Controls showcase card from the Claude Design mock, which shows solid / neutral / outline badges; subtle was used as the stand-in.
Notes
- New value on the existing
appearance axis: outline, themed via the same --color/--fg variables as solid/subtle.
- Badge may belong to a synced style group with Tag/Chip-like components — if so, land the appearance across the group together.
- Per-component style axes are a product decision — filing for triage rather than implementing.
Proposal
Badge currently has two appearances:
solidandsubtle(www/src/registry/ui/badge/styles.ts). Many design systems (shadcn, Geist, Linear) also ship an outline badge — transparent background, 1px border, muted foreground.Came up while implementing the landing Controls showcase card from the Claude Design mock, which shows solid / neutral / outline badges;
subtlewas used as the stand-in.Notes
appearanceaxis:outline, themed via the same--color/--fgvariables assolid/subtle.