Tag
BetaBatch A. A label for a keyword or filter. It can be static or removable.
When to use
Use to label items with categories or to show active filters people can remove.
When not to use
For status, use Badge.
Anatomy
Finance
- Container
- Label
- Remove button (removable tags only)
Variants
| Variant | How |
|---|---|
| Static | No onRemove. |
| Removable | Pass onRemove. Adds a 24px remove button. |
States
Pictures of each state. Use the live example on the Code tab to try the component.
| Default | Remove hover | Remove focus-visible | Remove pressed | |
|---|---|---|---|---|
| static | Finance | – | – | – |
| removable | Finance | Finance | Finance | Finance |
| disabled | Finance | – | – | – |