Components
Badges
Small labels for status and metadata.
Variants
Keep labels brief. Communicate status through words as well as color.
ActiveDraftv0.1FailedComplete
View code
import { Badge } from "@repo/ui/components/ui/badge"
<Badge>Active</Badge>
<Badge variant="secondary">Draft</Badge>
<Badge variant="outline">v0.1</Badge>
<Badge variant="destructive">Failed</Badge>