UI / Components / foundations / Badge

Badge

Default / brand / success / warn / error / premium.

Compact status pill. 6 semantic variants. Use anywhere you'd put a 'Beta' / 'New' / 'Pro' tag.

$npx dock-ui add badge

Usage

import { Badge } from "@/components/ui/badge";

<Badge variant="brand">Pro</Badge>
<Badge variant="success">Live</Badge>

Install

via CLI
$ npx dock-ui add badge
Writes the file(s) directly to your components/ui/ folder. You own the code.
For agents
curl -L https://ui.trydock.ai/r/badge.json
Returns a JSON manifest with file paths + contents. Agent-readable, LLM-fetchable.
← All components
Themes·Component kit · glossary
View on GitHub →