@launchcomponent/focus-vue

Badge

Badges are used to inform users of the status of an object or of an action that's been taken.

---

Best practices

Badges benefit users by:

• Using established color patterns so that users can quickly identify their status or importance level
• Being clearly labeled with short, scannable text
• Being positioned to clearly identify the object they're informing or labelling

---

Content guidelines

Badge label

Badge labels should:

• Use a single word to describe the status of an object
• Only use two words if you need to describe a complex state
• Always describe the status in the past tense