Badges
Badges indicate important tidbits of information and provide visual importance to users.
Basic Badges
People come in all sizes and shapes, and so shouldn't the badges come up that way too? No? Okay, guess you've "shaped" your ideology differently. We offer 3 sizes which can be cycled by using badge---small , badge and badge---large
Small Badge1
Round | Small
Default Badge1
Round | Default
Large Badge1
Round | Large
Implementation
Choose your Badge size and off you go!
Give the parent a position relative1
Tag Badges
Tag Badges are best used to bring attention to users on a particular object which can be triggered by using badge--tag--sm , badge---tag---lg and badge--large
Small BadgeVALID
Tag | Small
The Tag BadgePOPULAR
Tag | Default
Large BadgeFavourite
Tag | Large
Implementation
Not everyone likes to be independent. Some prefer cute little nudges!
Small BadgeVALID
Avatar Badges
Avatar badges are used to best represent the current states of the user, but we wanted it to be bit more cuter and rounder.They can be triggered by using badge---tag---sm , badge---tag---lg and badge---large
Implementation
Not everyone likes to be independent. Some prefer cute little nudges!
Icon Badges
Icons also need badges to let the users know of an important app instance, which can be triggered by badge , badge---icon and badge---large
Implementation
Choose your Badge size and off you go!
Give the parent a position relative1