Docs draft
NotificationBadge
When to use it
useUnread markers on header icons and menu rows: a count pill or a bare dot.
avoidAnything textual beyond a number — NEW labels are Tags.
tag Tag.Anatomy
pill — 20px min, micro type, color.bg.negative + color.text.on-status (contracted pair). 9+ caps the count.
dot — 10px, same fill, no text.
Design specifications
| pill | 20px, radius.full, bg.negative/text.on-status |
| dot | 10px |
Accessibility
role=status with a real label ('3 unread notifications') — the number alone is not a name.