Clear guidelines on when and how to use icons, including size, color, and placement.
Even the best icon set can fail if used inconsistently. Usage guidelines ensure that icons function as intended—as quick visual cues that aid navigation and understanding—rather than becoming decorative noise.
Test how icons align with text and ensure they have sufficient touch targets.
Use standard sizes (16, 20, 24, 32px). Ensure touch targets are at least 44px.
Optically align icons within their containers, not just geometrically.
Always pair icons with text labels for clarity, unless the icon is universally recognized (like a search glass).
Use color to indicate state (active, disabled, error) rather than just decoration.
Is the clickable area large enough (min 44x44px) even if the icon is small?
Are icons used for the same actions consistent across different screens?
Do icons have appropriate aria-label or alt text for screen readers?