Tag Component Playground

Interactive playground to test all Tag props and variants

Props

Label

Text displayed in the tag

Show Leading Icon

Show Dismiss Button

Label: Label

Leading Icon: No

Dismiss Button: Yes

Label

Code

<Tag label="Label" onDismiss={() => { /* handle dismiss */ }} />

Props (JSON)

{
  "label": "Label",
  "onDismiss": "(function)"
}

All States

Default

Label

With Leading Icon

Label

No Dismiss

Label

Long Label

Very Long Label Text

Multiple Tags Example

Filters

Label