NotificationBadge
NotificationBadge Component
Playground
🔔
5Props
| Prop | Type | Default | Value |
|---|---|---|---|
| count | number | — | |
| dot | boolean | — | |
| max | number | — | |
| color | selectprimary | error | warning | success | — | |
| position | selecttop-right | top-left | bottom-right | bottom-left | — |
Default
🔔
5DotOnly
✉️
MaxCount
99
99+
Positions
1
2
| PROP | TYPE | DEFAULT | DESCRIPTION |
|---|---|---|---|
color | select | — | Badge color |
count | number | — | Badge count |
dot | boolean | — | Dot-only mode |
max | number | — | Max count before overflow |
position | select | — | Badge position |
Using NotificationBadgetsx
import { NotificationBadge } from '@/components/NotificationBadge'
<NotificationBadge
count="..."
dot="..."
max="..."
color="..."
position="..."
/>Tokens Used
No design tokens detected