Azalea

Badge

A small label for a category, a count, or a version.

Tones

PRODUCTIONv1staging

Guidance

Use it when

  • A category: an environment, a kind, a version.
  • A count next to a heading.

Reach for something else when

  • The state of a process — that is StatusBadge. Keeping them apart is what stops “failed” being styled one way in Ivy and another in Root.
  • Anything clickable. A badge is a label; if it filters, it is a button.

Props

PropTypeDefaultDescription
tone"neutral" | "primary" | "outline""neutral"Visual weight.