Design system notes
Use icon buttons for compact utility actions where the surrounding context already explains the action.
Button/Icon/Clipboard
Use for one-tap copy actions like email addresses or reusable snippets. Default is idle, Hover confirms affordance, and Success confirms the copied state.
Button/Icon/Back Compact
Use for returning from case-study subpages or narrow navigation contexts. Keep it near the page’s supporting navigation, not as a primary call to action.
Button/Icon/Back Large
Deprecated for page use. Existing placements were removed; prefer Back Compact for future navigation affordances unless a larger touch target is required.
Use tags for scan-friendly metadata, project categories, component status, and small system labels.
Success
Info
Neutral
Tag/Filled
Use filled tags when the category needs to stand out in a list or project card. Success is for positive states, Info for product/system context, and Neutral for low-emphasis metadata.
Accent
Neutral
Info
Tag/Outline
Use outline tags for documentation notes, taxonomy, or secondary categorization. Accent should be reserved for the most important label in a cluster.