Iconography

Iconography

Overview

Icons aid recognition and scanning when used well. When used poorly, they confuse. A coherent icon system reinforces the design language and speeds comprehension.

When to Use

• Building or extending a product icon set
• Choosing icons for navigation and actions
• Establishing style, sizing, and usage rules
• Improving accessibility of icon-only controls

Core Practices

• Maintain consistent optical size, stroke, and corner language
• Prefer recognizable metaphors over clever abstraction
• Pair icons with labels for critical or uncommon actions
• Provide accessible names for icon-only buttons
• Define clear do/don’t usage guidelines

Principles

• Clarity beats cleverness
• Consistency within the set matters more than individual perfection
• Icons should simplify, not require a legend
• Test recognition with users when introducing uncommon metaphors

Verification

• Icons are distinguishable at intended sizes
• Critical actions aren’t icon-only without labels or tooltips
• Style is consistent across the set