Badge

Default: Optional icon and text in various decorative colors used to display a tag or metadata label.
Status: Required icon and text in various semantic colors used to display a status indicator.
Count: A label only used to display a count of items, typically nested in primitives like Button or Tabs.
Dot: A small round dot used to display a status indicator, typically positioned on top of primitives like Avatar or Button.
Closeable: Optional icon and text in secondary colors used to display a closeable item like a filter chip, typically displayed below a Toolbar or within Combobox or Select inputs.

Do use Badges to display metadata that can easily be sorted or filtered.
Do take caution to avoid too many Badges in a single context as this can become overwhelming and confusing for the user.
Do use an icon and label and correct semantic color pairing for the status Badge.
Do use an overflow Badge to display a count of items that exceeds the available space, often used for closeable Badges.
Don’t add interactivity to a Badge that would confuse it for a Button or link. Only closeable Badges should be interactive.

Default, status, count, and dot variants are informational and non-interactive unless product-specific rules say otherwise.
Closeable badges may expose a dismiss control only; they must not behave like primary navigation or arbitrary Button actions.

Status	Use case	Label examples
`Success`	Indicates stability or the clearing of one or more reported alarms. It can also be used to indicate success at the end of a process. Implies no issues are present.	Dynamic labels: running, stable, active / Static labels: successful, approved, connected, normal
`Warning`	Indicates a threshold has been breached; alerts a user before a critical event is triggered. It also indicates the possible requirement for corrective action to prevent a more serious fault.	Dynamic labels: warning, pending, unstable / Static labels: caution, dormant
`Error`	Indicates a process failure that needs immediate attention.	Dynamic labels: failing / Static labels: critical, error, failed, urgent, denied
`Info`	Indicates a process is scheduled or has started but has not finished running and does not have adverse effects on the system.	Dynamic labels: in progress, waiting, ready / Static labels: paused, incomplete (open), scheduled, in review
`Neutral`	Indicates a value that is outside of an acceptable range, formatted incorrectly, or an inactive status. It may also indicate an unpublished, or draft, state.	Dynamic labels: unknown, undefined, inactive, archived, draft / Static labels: undefined, inactive, archived, draft

Button, Tabs, Avatar, Data grid cells, Toolbar / filter rows, Combobox / Select menu items (right-aligned). Dropdown menu items, and Context menu items.

Documentation Index