Icon Design System


Icons sourced from a variety of free libraries were inconsistently implemented across products, resulting in visual clutter, lack of consistency, and too much complexity. There were no guidelines in place on how to introduce a new icon into the product.

As a leader of the design system team, I developed and implemented an icon system to support ongoing improvements in design quality.


A consistent, holistic, branded, own-able icon set would bring visual clarity thereby increasing the quality of the user experience. Prioritizing this foundational element of the design system would reduce overhead for teams creating new features.

My Role & Team

As the design system team manager, I led the project strategy, conducted audits, formed a designer team, and involved our illustrator, Grace Chen. Our close collaboration with brand and product designers, as well as stakeholders, ensured consistent development. I personally approved the initial designs and supervised documentation and processes to enable smooth set expansion.


Scope and Approach

We started with updating icons in the global left and top menus. To ensure consistency and aimed to match them with existing branded illustrations.

Design Principles

Build Trust

Aligning system icons with the brand will result in a high quality user experience.

Increase Efficiency

Develop a system that enables any designer to introduce new icons into the product. Designs should be simple, easy to understand, recognizable, and useful.

Final Design

The result was a beautiful custom library of icons that was indeed own-able. A cohesive design language improved the overall user experience by decreasing visual noise on the homepage and elsewhere.

Design Language

We aimed to create a unique language that could be replicated across all icons. We achieved cohesion by grouping icons into concepts like pages and people.


Scalable Design

We kept going with our growing list of icon needs. The design system allowed us to grow the icon set with visual consistency.

Pixel Perfect

Grace, the illustrator, worked directly with the design system designers and engineers to create a system of key-lines, sizing, and color specs.

Enablement & Implementation

I developed a process that enabled designers to efficiently request new icons and add them to their flows.


A process was developed that would make it easy to scale the library in both Figma and code libraries.


Documentation is key

Product teams need guidance on how to design and add a new icon to the systems.

Form follows function

Icon design is not just about the visuals. Getting the semantics right is essential.

It's the small things

A cohesive design system for icons supports the brand and promotes design excellence.