Badges
Small, rounded status labels. Source: src/ui/Badge.tsx.
Variants
Eight tones for status and categorization.
DefaultSuccessWarningErrorInfoPurpleTealOrange
Corner styles
Use rounded corners for compact labels, or the default pill for statuses.
RoundedPillStableBeta
In context
Badges sit inline alongside text and headings.
TanStack Query StableTanStack DB BetaDeprecated API Removed