#### UI elements / Badges

##### Basic Badges

Default
Primary Secondary Success Danger Warning Info Dark

Pills
Primary Secondary Success Danger Warning Info Dark

##### Label Badges

Label Default
Primary Secondary Success Danger Warning Info Dark

Label Pills
Primary Secondary Success Danger Warning Info Dark

##### Button with Badges

Default
Label
Outline

##### Badge Circle & Square Style

###### Basic

Default

1 2 3 4 5 6

1 2 3 4 5 6

###### Label

Default

1 2 3 4 5 6

1 2 3 4 5 6

##### Badge Circle & Square With Icon

###### Basic

Default

###### Label

Default

##### Dots Style

Primary
Secondary
Success
Danger
Warning
Info

##### Button with Badges Notification

##### Notifications With Icons

Small badge notifications.
6
5
4

##### Badges Position

Position using utility classes like `top-*`, `start-*`, etc...
4
4
4
4

##### Badge Overlaps for Shapes

Using `rounded-*` utilities for avatar & `.badge-dot` class for notification
9

##### Maximum Values

99
99+
999+

##### Custom label Badges

4
4
pi 4
4
4
pi 4
4