Skip to content
Powered byPagefind
BadgeBadge

Badge

Small inline label with color variants and optional icon.


Badge renders a small inline label with optional color variant and icon.

Usage

:badge[Stable]

:badge[Beta]{variant="warning"}

:badge[New]{variant="success" icon="star"}

:badge[Deprecated]{variant="danger"}

Preview

Stable

Beta

New

Deprecated

Attributes

Props

variant
Type
default | new | warning | success | info | danger | outline | ghost
Default
default
Required
Optional

Badge color variant theme.

icon
Type:
string
Required
Optional

Icon displayed on the left side of the badge label.

class
Type
string
Required
Optional

Additional CSS classes for custom styling.