Iconography

Do users actually understand icons without labels?

Iconography is the use of small symbols to stand for actions or objects. The catch is that very few icons carry a single, universal meaning - most are guessed at, and guessed differently by different people - so an unlabelled icon is often a quiet little riddle rather than the instant shortcut it promises to be.

Also known as: iconography, icons, icon meaning, icon labels

Prefer to watch? Watch the recap 0:48

The demo

Five icons you've seen a thousand times. For each, pick what you think it means - then see how sure anyone can really be without a label.

What this demo shows (text version)

The demo shows five common icons one at a time - a heart, a star, a circular arrow, an upward "share" arrow, and a bookmark - and asks you to choose what each most likely means from three plausible options. It then tells you how many matched the most common intended meaning.

The point isn't your score - it's that each of these icons genuinely carries different meanings in different apps (a heart is "like" or "save"; a circular arrow is "refresh", "repeat" or "undo"), so people resolve them by guessing, and often disagree. Only a small core of icons is truly universal. Everywhere else, pair the icon with a text label, because an unlabelled symbol leans on recall and ambiguity rather than instant recognition.

Most icons are more ambiguous than their designers think: a heart, a star, a circular arrow each mean several different things across apps, so people guess - and often guess wrong. Only a tiny set (home, search, close, print, the hamburger) is truly conventional. The safe default is an icon with a text label; reserve icon-only for that small, well-tested, universally-understood set.

Only a small core of icons is genuinely universal - magnifying glass for search, a house for home, an X to close, the printer, arguably the hamburger. Beyond that, recognition drops fast and meanings fork: a heart is "like" here and "save" there; a star is "rate", "favourite" or "featured"; a circular arrow is "refresh", "repeat" or "undo". People resolve the ambiguity by guessing.

Icons lean on recall, not recognition: an unlabelled symbol asks "remember (or work out) what this means", whereas a word lets you simply read it. That's why icon-only toolbars test so poorly, and why a tooltip - which only appears on hover, and never on touch - is a patch, not a fix. The reliable answer is a visible label.

So default to icon-plus-label, and keep icon-only for the tiny universal set, for space-critical spots you've actually tested, or as a redundant cue beside a label (helping scanning, not replacing meaning). An icon's job is to speed recognition of something already understood - not to be the only thing carrying the meaning.