Badge
Badges are used to inform merchants of the status of an object, or the status of an action that’s been taken.
optional = ?
| Name | Type | Description |
|---|---|---|
| message | string |
The content to display inside the badge. |
| status? | "success" | "info" | "attention" | "warning" | "new" |
Set the colour of the badge for the given status. Default value: none |
| ✅ Do | 🛑 Don't |
|---|---|
| Use Badges to display the status of an object | Use Badges without context, or as singular objects |
| Use Badges to represent discrete information | |
| Have clear and helpful relationship to the content or task they represent | |
| Badges can be stacked horizontally |
For more guidelines, refer to Polaris' Badge best practices.