Component
Badge
Small inline label for status, categories or counts. Five color variants and an optional leading icon.
Default
Info
Success
Warning
Error
Featured
jsx
<Badge label="Default" />
<Badge label="Info" variant="blue" />
<Badge label="Success" variant="green" icon={CheckCircle} />
<Badge label="Warning" variant="yellow" icon={AlertTriangle} />
<Badge label="Error" variant="red" icon={XCircle} />
Props
| Prop | Type | Default | Description |
|---|---|---|---|
label
|
string | — | Text shown inside the badge. |
variant
|
'default' \ | 'blue' \ | 'green' \ |
icon
|
LucideIcon | — | Optional icon component rendered before the label. |