Docs
徽章
徽章
显示徽章或看起来像徽章的组件。
Badge
安装
pnpm dlx shadcn@latest add badge
用法
import { Badge } from "@/components/ui/badge"
<Badge variant="outline">徽章</Badge>
链接
您可以使用 badgeVariants
辅助函数创建一个看起来像徽章的链接。
import { badgeVariants } from "@/components/ui/badge"
<Link className={badgeVariants({ variant: "outline" })}>徽章</Link>
示例
默认
Badge
次要
Secondary
轮廓
Outline
破坏性
Destructive