DefaultSecondarySuccessWarningDestructiveOutline
LiveReviewv0.1.0
Installation
Usage
import { Badge } from "@/components/ui/badge"
export default function Example() {
return <Badge>New</Badge>
}Variants
| Variant | Description |
|---|---|
default | Soft surface (default) |
secondary | Muted subtle fill |
success | Green success status |
warning | Amber warning status |
destructive | Red danger / error status |
outline | Bordered transparent background |
Props
| Prop | Type | Default |
|---|---|---|
variant | "default" | "secondary" | "success" | "warning" | "destructive" | "outline" | default |
className | string | — |