Github

Badge

Displays a compact label for status, category, or metadata.

Installation

pnpm dlx shadcn@latest add https://components.sudarshandhakal.com.np/r/badge.json

Usage

import { Badge } from "@/components/ui/badge"
<Badge>Active</Badge>

Reference

Props

The Badge component accepts all HTMLDivElement props plus the following:

PropTypeDefault
variant"default" | "secondary" | "destructive" | "outline"
"default"