PureKit UI logoPureKit UI

Badge

Small status indicator for labeling content.

Variants

Different visual variants

DefaultSuccessWarningErrorInfo

Sizes

Badge sizes

SMMDLG

Label Prop

Using label prop instead of children

New

Main Props

NameTypeDefaultDescription
variant
'default' | 'success' | 'warning' | 'error' | 'info''default'Visual style of the badge
size
'sm' | 'md' | 'lg''sm'Badge size
label
any-Label text when children are not provided
children
React.ReactNode-Badge content

Class Props

NameTypeDefaultDescription
className
string''Additional CSS classes