Icons
Clear
Icons are simple and effectively convey their intended meaning. Avoid unnecessary complexity that makes the icon difficult to recognize. The goal is to communicate quickly and clearly.
![Two icons made with basic geometric shapes representing an house and a flower.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-clear-1%402x.png&w=1920&q=75)
Draw simple objects that are easy to identify.
![Two detailed icons representing an house and a flower.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-clear-2%402x.png&w=1920&q=75)
Embellish icons with unnecessary details.
Consistent
Icons follow a cohesive visual style across the user interface. This includes a consistent use of line weights, shapes, dimensions, perspectives, and general style. Consistency in designs enables users to quickly recognize functionality and navigate the interface more intuitively.
![On top: a series of icons using the same check mark element. At the bottom: a series of icons using a credit card represented consistently.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-consistent-1%402x.png&w=1920&q=75)
Reuse parts of other icons in the set to maintain visual harmony across all icons.
![A microphone and a pencil represented in a way that is consistent with common interfaces.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-consistent-2%402x.png&w=1920&q=75)
Use universally recognized icons.
![A microphone and a pencil represented in a unique way.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-consistent-3%402x.png&w=1920&q=75)
Reinterpret or stylize universally recognized icons.
Universal
Universally recognized symbols and metaphors ensure icons are easily understood by a broad user base.
![Left: an icon composed with a shopping cart and an x sign. Right: an icon composed with a person and a plus sign.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-universal-1%402x.png&w=1920&q=75)
Leverage universally recognized symbols and metaphors to create new icons.
![An icon with a 2 euro coin representing the concept of “Money”; an icon with an american football representing the concept of “Sports”; and a floppy disk representing the concept of “Save”.](/_next/image?url=%2Fimages%2Fdesign%2Ficons%2Ficons-overview-universal-2%402x.png&w=1920&q=75)
Relying on cultural-specific, niche, or outdated metaphors may not be suitable for all users.