Icon fundations

Icon fundations

Using icons

/ Part 1

/ Part 1

You see them. You use them. But do you notice them? Icons shape the way we navigate both the physical and digital worlds—from street signs to app interfaces. As modern life speeds up, they help us scan and decide in an instant.


Digital Interfaces

Inseparable from computers and devices, icons improve users digital experience:

  • Instant Recognition – Helping users scan content and act faster.

  • Clear Hierarchy – Drawing attention to what matters most.

  • Universal understanding – Removing language barriers with intuitive images.

  • Space-Saving – Packing maximum meaning into minimal symbols.



Apple Watch / Maximising space with icon-first design

To overcome limited screen space, Apple uses icons in the Watch UI for easier feature access and quicker information scanning.



AirBnB / Icons and UI in perfect harmony

Airbnb Icons are heavily used in the UI — Check out this thread by Denislav Jeliazkov on why Airbnb sets the “gold standard” for UI design.



Ebay / A consistent icon library for easier navigation

The Ebay icon library focus on consistency and legibility. Created by the Ebay design team.



Hybrid style icons

Icons for productivity app by Alexey—solid shapes meet thin strokes in an icon style that’s both bold and clear.



Wayfinding

In airports, offices, and transit, icons aren’t decoration—they’re essential for instant, intuitive navigation:

  • Quick recognition – Simple, clear symbols allow for fast decision in busy environments.

  • Safety & accessibility – Essential for emergency signs and accessible navigation.

  • Space-saving – Communicate complex ideas in compact forms.

  • Universal meaning – Icons break language barriers, ensuring everyone can navigate spaces easily.



Airport signage / Classic iconography

For airports and transit, icons need to maintain a classic style to ensure signage is clear and easily understood, leaving little room for creative variation.Signage in Flughafen Tempelhof airport, Berlin. Photo by Sebastian Herrmann on Unsplash.


Modern wayfinding / Creative icon style

Beautiful balance of legibility and unique style for the Arena MRV Stadium.



Modern wayfinding / Usage of depth and colors

Icons in signage can take various forms—extruded in metal, painted on directional signs, or carved in wood. By Blank Studio/Mireia Soler/Blank Studio – Read more.




Packaging

Good icon design in packaging isn’t just about looking nice—it helps busy shoppers quickly get the gist of a product in a crowded supermarket aisle. Plus, it shows the brand cares about being clear and honest. Here’s why icons make a difference:

  • Quick info – Icons instantly tell shoppers key details like “eco-friendly,” “recyclable,” or “organic.”

  • Standout appeal – Eye-catching icons make packaging pop on crowded shelves.

  • Less clutter – Icons pack info into small spaces, keeping labels clean and simple.

  • Builds trust – Clear, consistent icons show the brand is upfront about what they’re offering.


Raiz / Icons for product features

Packaging design by The Small Monsters.



Braun / Icon system for product features

Braun icon system by Iconwerk.



Uclay / Icons as decorative symbols

Packaging design and branding by Tubik Studio.




Marketing iconography

Icons play a key supporting role in marketing and shopping websites. They help highlight product features, draw attention to key benefits, and make content more scannable. Visually catchy and easy to recognize, icons guide the eye toward important points—like free shipping, return policies, or product highlights—without overwhelming the layout:

When text-heavy pages start to feel dense, icons bring visual breaks that let the content breathe. They improve readability, hierarchy, and add personality to otherwise plain sections.

  • Simple and bold icons: to stay legible at small sizes.

  • Universally recognizable: so users instantly grasp the meaning.

  • Consistent in style: to match the brand and avoid visual clutter.

  • Often used with short text labels: reinforcing the message without relying solely on visuals.


Apple / Minimal icons for product features

Apple has long influenced icon designers with its minimal, highly legible style.



Gustini / Hand-made style icons for product features

Gustini icons by Koto Studio.




Stripe / Duotone flat icons as feature illustrations

Stripe use a large, consistent icon system to illustrate their feature sections, colors change depending on the type of product.




Lululemon / Icon system for product features

Lululemon icon system by Zach Roszczewski.



Graphic Design + Advertising

Icons aren’t just for apps and wayfinding—they can add great value to traditional design as well, such as in posters, presentations, and books. Beyond functionality, they offer a lot as decorative elements:

  • Grab attention: Icons break up text and add variety, making layouts more engaging.

  • Balance the space: Icons fill empty spots and help guide the eye through the layout.

  • Show personality: stylish icons add character and help express a brand’s identity.

  • Add depth: Use icons as background patterns or layered elements to bring texture and complexity.


Patterns / Icons as decorative elements

Icon patterns by Kevin Moran.



Deliveroo / Icons as brand illustrations

Deliveroo icons by Gregory Darroll.



Story telling / Icons as focus points

Soluna iconography by Akinbinu Akintayo.