Badge

Small status indicators and labels. Supports 4 variants with the brutalist square, no-rounded design.

Import

import { Badge } from "poyraz-ui/atoms";

Variants

Four visual variants for different contexts.

Default

Secondary

Outline

Destructive

<Badge>Default</Badge>
<Badge variant="secondary">Secondary</Badge>
<Badge variant="outline">Outline</Badge>
<Badge variant="destructive">Destructive</Badge>

Use Cases

Badges for status indicators, counts, and labels.

19 components

New

Deprecated

v2.0

<Badge variant="outline" className="text-xs">19 components</Badge>
<Badge variant="secondary">New</Badge>
<Badge variant="destructive">Deprecated</Badge>