Tag
Inline štítek s variantami filled / light / outline / dot, 5 velikostmi, 9 barvami a dismiss
Installation
pnpm dlx shadcn@latest add https://registry.ceskysoftware.cz/r/tag.json
Usage
Preview
Varianty (modrá)
filledlightoutlinedot
Barvy (light)
primarysecondarybluegreenredorangeyellowgreydark
Barvy (filled)
primarysecondarybluegreenredorangeyellowgreydark
Barvy (dot)
primarysecondarybluegreenredorangeyellowgreydark
Velikosti (light, blue)
xssmmdlgxl
S dismiss tlačítkem
redbluegreen
S ikonou
OblíbenéStáhnout
Import
import { Tag } from "@/components/ui/tag"
Example
// Varianty
<Tag color="blue" variant="filled">Filled</Tag>
<Tag color="blue" variant="light">Light</Tag>
<Tag color="blue" variant="outline">Outline</Tag>
<Tag color="green" variant="dot">Online</Tag>
// Smazatelný
<Tag color="red" size="md" dismissible onDismiss={() => {}}>Smazat</Tag>
// S ikonou
<Tag color="primary" size="md" icon={<Star className="size-3" />}>Oblíbené</Tag>
Dependencies
class-variance-authorityhttps://registry.ceskysoftware.cz/r/utils.json (registry)