Skip to main content

Installation

npx shadcn-svelte@next add badge

Usage

<script lang="ts">
  import { Badge } from "$lib/components/ui/badge/index.js";
</script>

<Badge variant="outline">Badge</Badge>

Examples

You can use the badgeVariants helper to create a link that looks like a badge.
<script lang="ts">
  import { badgeVariants } from "$lib/components/ui/badge/index.js";
</script>

<a href="/dashboard" class={badgeVariants({ variant: "outline" })}>Badge</a>

Build docs developers (and LLMs) love