Anatomy

A tag consists of a container (A), a label (B), and an optional icon (C) for visual context or removal.

Types

Purpose

Tags are used to display associated metadata, categories, or applied filters — not for interactive selection.

Non-interactive by default

Tags are passive and not meant to be clickable unless explicitly designed for small indicators.

Short labels

Tags should be short, scannable, and ideally single-word.