Badge
Display an indicator that requires attention.
Imports
Usage
Badge Variants
Badge has 4 variants primary secondary outline ghost
You can add extra variants & sizes via the theme file. Checkout theming guide.
Badge Sizes
Badge comes with 3 sizes sm md lg
Floating Badge
In some scenarioes where you want to add a floating badge on an element's
corners you can set the Badge component to be floating
API Reference
Prop | Type | Default |
|---|---|---|
size | union | md |
variant | union | primary |
floating | boolean | false |
position | union | top-right |