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

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

Try it yourself on the playground

Playground