Tag Group

Used when presenting multiple tags, especially in a scenario where space is limited.

Stable
Show details
Stable
Published: October 12, 2025
Updated: October 13, 2025

Anatomy

Anatomy summary lists and describes all the elements within a component (including nested components).

taggroup-anatomy

Element

Description

Optional?

1. Tag container

Primary container that holds the label and optional Icon and Avatar.

No

2. Tag label

User-generated text describing the tag.

No

3. Dismiss button

Indicates the tag can be dismissed.

Yes

4. Tag count with link

Textual link with a count of hidden tags, pointing to a page where all tags can be displayed.

No


Variants

Variants contain different versions of the component depending on specific properties, such as state, size, color, optional iconography, etc.

TagGroup
Property Values Default
✏️ counterLink Text string +23 more

Dismissible vs Non-dismissible

Tag Group should be constructed using dismissible or non-dismissible Tags: either all Tags within the Tag Group can be dismissed or none, without mixing the two.

Tag appearance

Similarly, Tags displayed within the Tag Group should have a consistent appearance (without mixing multiple styles). Choose one of the following:

TagGroup
TagGroup

Component dependencies

This component is internally dependent on the following components:


Help and support