Badge.
Badges are used to display status information, cart item count,
notification count etc.
These are small circles, positioned either at top-right or bottom-right of the parent component.
These are small circles, positioned either at top-right or bottom-right of the parent component.
Badge on avatar
The badge on avatar is available in 4 different statuses -
online, offline, Idle & DND.
Badge Sizes
Badges can vary in different sizes like small, large, extra large etc.
industry.
Badge on icons
Generally used for notification count, these badges overlay over common
used icons.