Badge
Component for short notes with one color as status messages
A <Badge> is a content component. This component can be used to reflect status messages via a short note and a color. The content of a badge can be arbitrary, but it is preferred to use a string and/or a icon.
Import
import { Badge } from '@marigold/components';Appearance
| Property | Type | Description |
|---|---|---|
variant | default | inverted | success | info | warning | error | The available variants of this component. |
size | - | The available sizes of this component. |
Props
Sorry! There are currently no props available.
Examples
Info Badge
In this example we have the <Badge> component that has been given the variant info and a string.
Preview
Code
new
Badge with an Icon
In this example, the <Badge> component gets an icon component.
Preview
Code
Badge with variant
Here you can see the <Badge> component with variant dark.
Preview
Code
vor kurzem aktualisiert