Building a coherent icon system

How to grow a product icon set over time without ending up with a Frankenstein collection of mismatched glyphs.

The problem with one-off downloads

Most product icon systems begin life as a series of one-off downloads. A designer needs an icon for a new feature, opens up an icon library, finds something close, and ships it. Over months and years, those one-off downloads accumulate. Some are filled, some are outline. Some are 1 px stroke, some are 2 px. Some have rounded corners, some have sharp ones. The result is an icon set that nobody chose deliberately and nobody likes.

Make the source the system

The fix is to commit to a single source library and treat that commitment as a first-class design decision. When you need a new icon, your first move is to look in the source. Only if the source genuinely lacks the icon do you go elsewhere — and then, ideally, you commission a custom icon drawn in the source's style rather than dropping in a stranger. This single rule prevents most icon-system drift.

Document the rules

Write down the icon rules and put them somewhere the team can find. Which library is the source. Which sizes are allowed. Which stroke weights. Which colors. Which corners. The document does not have to be long — half a page is usually enough — but it has to exist. Without it, every new designer who joins the team has to re-derive the rules from looking at the existing screens, and they will inevitably make small mistakes that accumulate.

Audit quarterly

Once a quarter, run an audit. Pull every icon currently in production into a single document and look at them as a set. Are there duplicates that mean the same thing in different visual styles? Are there outliers that look nothing like the rest? Are there old icons that should have been retired when the feature changed? Mark the offenders and schedule a sweep. The audit takes a few hours; the cost of skipping it is a fragmented icon system in twelve months.

Plan for retirement

Some icons in your set will need to be retired as features change. Plan for retirement at the start. Keep a single source-of-truth document — a Figma file, a sprite sheet, an icon library page — that lists every icon currently in production and the surface where it appears. When a feature is removed, the corresponding icon should be removed from the source-of-truth document at the same time. If you skip this, the icon library bloats by ten or fifteen percent every year.

Add deliberately

When a new feature ships and needs an icon, add the icon deliberately. Sketch the candidate options. Place each one in the actual screen. Show them to two or three teammates and pick the one that reads best in context. Do not, under any circumstances, let an icon choice happen as a side effect of a feature ship. The thirty extra minutes you spend choosing the icon at the start saves three hours of redesign in eighteen months.

Keep reading