Learn More
Brand iconography as a system layer, not an afterthought
Home  ⇨  Insights   ⇨   Brand iconography as a system layer, not an afterthought
A brand iconography system treats icons as a governed brand layer, not decoration — the construction grammar, governance, delivery and naming rules that keep an icon set coherent across product, marketing and documentation.

A brand iconography system is the layer most teams discover they need only after it has already gone wrong — a settings cog in three different weights, two unrelated styles of arrow, a help icon that means something different on every screen. Icons get treated as decoration, drawn one at a time as features ship, and the incoherence compounds quietly until the product looks assembled by strangers. Treating iconography as a first-class brand layer, governed like type or colour, is cheaper than the cleanup and far more visible than most teams expect.

Why iconography is a brand layer, not a deliverable

Most organisations commission a logo, a palette, and a type system, and then leave icons to be produced on demand by whoever is closest to the feature. The result is predictable: a set that grew rather than was designed. Each icon was reasonable in isolation, but the set as a whole has no shared grammar — no agreed stroke weight, no consistent corner radius, no rule about whether things are drawn as outlines or filled shapes. Users do not read icons one at a time; they read them as a family, and a family that does not resemble itself reads as carelessness.

The shift that matters is to stop thinking of icons as individual assets and start thinking of them as a system with its own rules, the same way a type system has rules about scale and a colour system has rules about contrast. A brand iconography system is a governed layer of the identity, not a folder of SVGs. Once it is framed that way, the questions change from "what should this icon look like" to "what are the constructional rules every icon in this brand obeys", which is a far more durable thing to decide once.

The construction grammar of a brand iconography system

Coherence in an icon set comes from a small number of constructional decisions applied without exception. The grid the icons are drawn on — typically 24×24 with a defined keyline shape and padding — fixes their optical size so a square icon and a circular one feel the same weight beside each other. The stroke weight, expressed in absolute units and held constant, is what makes the set look drawn by one hand. The corner radius, the terminal style, the way a diagonal is allowed to meet a vertical: these sound like pedantry until you see a set where they drift, at which point they are the entire difference between professional and improvised.

These rules are not aesthetic preferences to be relitigated per icon. They are the specification of the system, and their value is precisely that they remove judgement from the individual case. When a new icon is needed, the person drawing it is not inventing a style; they are applying an existing one. That is what a system buys you — not a fixed set of icons, which will always need to grow, but a fixed way of growing it.

Where a brand iconography system has to work

The reason iconography deserves brand-layer status is that it appears in more places than almost any other identity element. The same set has to function as 16-pixel affordances inside dense product UI, as larger feature markers on a marketing site, as section markers in documentation, and sometimes as spot illustrations in a deck. Each context has different demands — the product needs legibility at tiny sizes and a clear distinction between interactive and decorative; marketing can afford more expressive, larger treatments; documentation needs neutrality so the icons support the text rather than competing with it.

A set designed only for one of these contexts breaks in the others. Icons drawn for marketing impact turn to mud at 16 pixels; icons drawn purely for UI density look thin and timid blown up on a landing page. A brand iconography system anticipates the full range, which usually means defining a base set with strict construction rules plus documented guidance on how the set flexes across sizes — heavier optical adjustments at small sizes, permitted expressive variants at large ones. Nielsen Norman Group's research on icon usability is a useful corrective here: icons are rarely self-evident, and the system has to account for labels and context rather than assuming a symbol will carry meaning alone.

Governance: who owns the set as it grows

The hardest part of an icon system is not drawing the first hundred icons; it is governing the next hundred, which arrive one at a time, under deadline, requested by people who do not know the construction rules. Without an owner, every new icon is a small opportunity for drift, and drift is cumulative. Within a year an ungoverned set has three settings cogs and a help icon nobody can agree on.

Governance means a named owner, a request route, and a small amount of friction in the right place. When a team needs a new icon, there should be a defined way to ask for it, a person or function responsible for either drawing it to spec or approving a submission against the spec, and a single source of truth the new icon is added to once approved. This connects directly to how the brand hands work to engineering: an icon system lives or dies on the same handoff discipline as the rest of the visual language, which is why it belongs alongside design tokens in the brand-to-engineering handoff rather than in a designer's private file.

The technical layer most brand teams skip

An icon system that exists only as a design file has solved the easy half of the problem. The half that determines whether the system actually holds is delivery: how icons reach the product, in what format, and how they stay in sync when they change. A set shipped as loose SVGs pasted into the codebase will fork the moment an engineer needs a tweak, and within months the icons in production no longer match the icons in the design file. A set shipped as a versioned icon font or component library, with a single pipeline from source to product, stays coherent because there is only one copy.

This is the point at which brand teams often hand the problem to engineering and lose ownership of it, which is a mistake — the delivery mechanism is part of the system's integrity, not an implementation detail beneath the brand's concern. The brand team does not need to build the pipeline, but it does need to specify that one exists, that icons are versioned, and that there is a single governed source. Otherwise the careful construction grammar decided up front quietly degrades in the gap between design and code.

Naming and findability inside the set

A system of two hundred icons that nobody can find is functionally a system of the twenty everyone remembers. Naming is the unglamorous discipline that makes the set usable: consistent, predictable names, organised so a designer or engineer can locate the right icon without scrolling through everything. The failure mode is naming icons by appearance — "magnifying-glass" — rather than by meaning — "search" — which guarantees confusion the first time the same shape is used for a different function, or a different shape for the same function. A small naming convention, decided once and applied across the set, is what turns a large icon library from a liability back into an asset.

What This Looks Like in Practice

In our work with Fanblock, the icons had grown exactly the way most sets do — drawn feature by feature, each defensible alone, incoherent as a family. Rather than redraw everything at once, we started by writing the construction grammar: the grid, the stroke weight, the corner and terminal rules, and the naming convention. With the rules fixed, the existing icons could be triaged — which already conformed, which needed redrawing, which were duplicates to be retired — and new requests could be drawn to spec instead of to taste. The visible result was a set that finally looked like one product. The more valuable result was that the team stopped making a fresh style decision every time a feature needed an icon, because the brand iconography system had already made it for them.

Closing

A brand iconography system earns its place not because icons are decorative flourishes but because they are everywhere, read as a family, and quietly corrosive when they drift. Decide the construction grammar once, govern the set as it grows, own the delivery pipeline rather than handing it off, and name the icons so people can find them — and the set stops being a recurring small embarrassment and starts being a layer of the brand that compounds in your favour.

If your icon set has grown past the point of coherence and you want help turning it back into a governed system, we are happy to help you build the rules.