Badge
Overview
A badge is used to annotate other information like a label or an object name.
neutral
- Indicates generic information or a message with no severity.danger
- Indicates a danger state, like an error that is blocking a user from completing a task.warning
- Indicates a warning state, like a non-blocking error that might need to be fixed.caution
- Indicates an action or notice which should immediately draw the attentioninfo
- Indicates helpful information or a message with very little to no severity.success
- Indicates a success state, like if a process was completed without errors.
Status
Sample element
When to use
- When you need to reflect counts like number of objects, events, or unread items
Two badges; from left to right, one badge has a dark gray background with a
white counter number and the other badge has a purple background with a white
counter number.