Badge
Small pill-shaped label for status and metadata.
Live Demo
DefaultSecondaryDestructiveOutline
Props
| Prop | Type | Default | Description |
|---|---|---|---|
variant | 'default' | 'secondary' | 'destructive' | 'outline' | 'default' | Visual style variant. |
children | React.ReactNode | — | Content inside the badge. |
Usage
import { Badge } from '@ghiberti85/ui'
<Badge variant="default">Default</Badge>
<Badge variant="secondary">Secondary</Badge>
<Badge variant="destructive">Error</Badge>
<Badge variant="outline">Outline</Badge>