Tags - Components

Display tag

<span class="ecl-tag ecl-tag--display">Display tag</span>

Try it yourself on the playground

Playground

Link tag

Fullscreen

<a href="/example" class="ecl-tag">Link tag</a>

Try it yourself on the playground

Playground

Removable tag

Fullscreen

<span class="ecl-tag ecl-tag--removable">Removable tag<button type="button" aria-label="Dismiss"
    class="ecl-tag__icon"><svg focusable="false" aria-hidden="true" class="ecl-tag__icon-close ecl-icon ecl-icon--xs">
      <use xlink:href="/component-library/v2.39.0/dist/media/icons.3cf410f9.svg#ui--close"></use>
    </svg><svg focusable="false" aria-hidden="true" class="ecl-tag__icon-close-filled ecl-icon ecl-icon--xs">
      <use xlink:href="/component-library/v2.39.0/dist/media/icons.3cf410f9.svg#ui--close-filled"></use>
    </svg></button></span>

Try it yourself on the playground

Playground