Badges

View our badge designs, suitable for displaying counts, status, or categorization in a compact and informative way.

Alignments

Variety of badge positions showcasing alignment options on parent elements.
99+
99+
99+
99+

Avatar

Badges tailored for avatars, indicating user status or notifications.
A
...
A
53
...
12

Basic

Classic badge style for straightforward notifications and counts.
76
3
5
9
99+
ok
0

Dot

Minimalist dot badges to subtly indicate updates or presence.

Dot Large

An enlarged dot badge for more prominent visibility while maintaining a minimalist design.

Dot Ring

Dot badge encircled by a ring, combining the simplicity of the dot with an added layer of emphasis.

Inline

Badges designed to fit seamlessly within textual content or inline elements.
99+

Primary Badge

Notification
Success

Profiles:

43
99+

Primary Badge

Notification
Success

Profiles:

43

Provisioning in progress...

Error

Success

Something is wrong!

Overlaps

Badge style designed to overlap onto container elements, typically icons or avatars.