Iconography
Guiding but never distracting, our icons focus on function over frills. They use a visual language that everyone can understand to add explanation at a glance and bring clarity to dense designs.
Using icons in your designs
In both product and marketing, icons support usability and help users navigate experiences. Because of this, icons should not be used as decoration — in those cases, illustrations are the right choice.
Icon Types
General
You may use most icons in the library at your discretion. They have no hierarchy. The ribbon icon representing an award holds the same weight as the vehicle icon representing travel.
Navigational
Users rely on these icons. Simple, abstract designs like chevrons, arrows, and hamburgers, as well as icons representing utilities like profile and settings help people get around the product. These icons should be used only for their intended purposes to keep their meanings clear.
Special use
Icons designed for specific products or uses, including logos. Consider these off-limits without approval.
Style and implementation
Sizes
Icons come in three sizes:Pairing
When pairing icons with text we recommend the following:Color
Only apply color to help convey meaning, not for decoration. Use a minimum contrast ratio of 3:1. Colors must have at least a 40% difference in tonal value to achieve that contrast ratio.Recommendations
Do provide adequate container size
Use the appropriate size of icon and container.
Do center align to text
This keeps the two visually connected.
Do use existing conventions
Use established conventions for icons.
Do pair icons with labels
Pairing text with icons clarifies its intended use.
Do apply solid brand colors
Use colors according to their definition and meaning.
Don't use small containers
Don’t overlap the bounding area of icons when placing inside a container.
Don’t baseline align to text
The two will look off.
Don’t redefine function
Use icons according to accepted meanings and conventions.
Don't use icons without labels
Always pair them with text.
Don't apply mixed colors
No duo-tone or multicolor icons.
Library
Explore the icons that mark the actions and directions people can take in our products.
External partners and agencies should ask their Indeed point of contact for access. Indeed employees can visit the icon library directly. (This library is only for use in product applications.)