Skip to content

Badge

Badges bring the user's attention to something.

Usage

Badges will use the "default" variant by default, but you can use the available variants with the variant prop.

Variations

Custom Variant

Custom variants can be defined in your theme using the variants property.

Properties

NameValuesDefault

variant

defaultsuccesserrorwarninginfo

default

...

JSX.IntrinsicElements["span"]

Tokens