Badge
Badges are used to indicate unchecked notifications, item counts, or other important numeric information relating to the item it's next to.
Takeaways
- Use number badges for counts of important information, such as the number of unread messages in the Inbox or unavailable items in a menu section.
- Use dot badges to notify users of important status changes or unchecked notifications without showing an item count.
Type
| Type | Purpose |
|---|---|
| 1. Dot | Used to indicate an unread notification or status change without showing a number. |
| 2. Number | Used to indicate an item count, such as the number of unread messages or unavailable items in a menu section. |
Content
Number badges should only contain numbers, but you can add letters and special characters such as "+", "-" or "K" alongside a value to indicate variations (e.g. "+3") or abbreviate large values (e.g. "1.5K").