v0.27.0
Badges are used to quickly indicate status or information to a user visually. Each variant correlates to a specific status or value. Badges Design Guidelines.
Edit the code below to see your changes live!
Prop Name | Type | Default | Description |
---|---|---|---|
label * | string |
| The text applied to the component. |
variant | danger | secondary | success | warning | secondary | Determines which badge to display. |
Props ending with * are required
Margin Props
There are four types of variants to choose from: success
, secondary
, warning
, and danger
. You can determine what type by using the variant
prop.
Edit the code below to see your changes live!