Pill

Use the Pill component to create colored pills. These could be used for user roles, or something else.

Props

text string
optional
variant Variant
optional
iconLeft Icon
optional
iconRight Icon
optional
small boolean
optional
interactive boolean
optional

Events

on:click PointerEvent | MouseEvent

Example

Primary
Positive
Negative
Warning
Red
Orange
Yellow
Green
Teal
Blue
Blurple
Purple
Magenta
Pink
Grey
Primary
Positive
Negative
Warning
Red
Orange
Yellow
Green
Teal
Blue
Blurple
Purple
Magenta
Pink
Grey
Home
Done
Click me