Components
Badge
Inline labels with variant or status colors, dot indicators, and optional glass surface. 6 variants, 5 sizes.
Playground
Explore all badge props interactively.
Label
Props
Theme color
Render style
Badge size
Show dot indicator before text
Glass surface density
Backdrop blur intensity
Colored glass accent orbs behind content
Elevated with shadow
Glow intensity
Status
Status-colored badges for contextual information. Status overrides the variant color.
Info Success Warning Error
Dot Indicator
Badges with a dot indicator before the text for additional visual signaling.
Default Info Active Pending Offline
Glass Variants
Frosted glass badges with backdrop blur. Best on dark or gradient backgrounds.
Default Primary Secondary Outline Destructive Info Success Warning Error