Badges are usually seen in social media apps to indicate the status of whether a person is online or offline. They are also used to indicate number of unread notifications.

Badge on icon can be used to show number of notifications, unread messages and so on. It usually has a icon with a number representing count on that notification. The position of badge can be changed using the classes .badge-top-right to position it top right of the icon and .badge-top-left to position it top left of the icon.

Badges on avatars can be used to indicate the status of the person — whether he / she is online. They can be as simple as a small dot or a circle with border around the image