Surfaces
Badge
An outlined mono tag for a count or a state.
v0.1.0new34livedraftfailedbeta
npx shadcn@latest add https://ui.netm8.com/r/badge.jsonclass-variance-authority
Surfaces
An outlined mono tag for a count or a state.
npx shadcn@latest add https://ui.netm8.com/r/badge.jsonimport { Badge } from "@/components/ui/badge"
export default function BadgeDemo() {
return (
<div className="flex flex-wrap items-center justify-center gap-2">
<Badge>v0.1.0</Badge>
<Badge variant="lamp">new</Badge>
<Badge variant="solid">34</Badge>
<Badge variant="ok">live</Badge>
<Badge variant="warn">draft</Badge>
<Badge variant="bad">failed</Badge>
<Badge variant="info">beta</Badge>
</div>
)
}