Badges
Badges are used to highlight an item's status for quick recognition.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| variant | 'default' | 'primary' | 'success' | 'warning' | 'error' | 'default' | The visual style of the badge. |
| children | ReactNode | - | The content to display inside the badge. |
Variants
Use different variants to match the tone of the status you're highlighting.
Default
Default
<Badge>Default</Badge>Primary
Primary
<Badge variant="primary">Primary</Badge>Success
Success
<Badge variant="success">Success</Badge>Warning
Warning
<Badge variant="warning">Warning</Badge>Error
Error
<Badge variant="error">Error</Badge>