Since we are getting more UI questions here on icons and I didnt see this question here I thought it would be on topic to ask what the difference between an icon and a button are other than an icon sometimes has more design aesthetics and a button fires an event or takes you somewhere. So my question is: How do you judge the difference between an icon and a button?

  • This depends on the context within which you're defining button, and icon.
    – Confused
    Commented Feb 23, 2014 at 10:43
  • A button always triggers events.
    – Scott
    Commented Feb 24, 2014 at 1:08

3 Answers 3


An icon is representative of something. You can have a company newsletter with icons in the margin of each story representing HR, IT, Sales, Marketing, etc.

A button is by definition interactive. You click on it and something happens. It may have pictures, words, or both.

You can have an interactive icon which acts as a button, but if you click on a little ideogram and nothing happens, it's not a button.


@Lauren Ipsum and @sambler have of course answered beautifully - I just thought I'd add a different perspective.

We tend to think of icons as those little digital images that almost always trigger some digital event of some sort. They do not have to trigger anything, there are examples of digital icons that are merely demonstrating a context or process.

enter image description here

However, icon is originally a word for image, referring to religious paintings particularly from the Eastern Catholic Church. Traditional icon painting have some pretty specific methods and materials. But never mind.

enter image description here

So what are icons? They more or less have an entire scientific field dedicated to them....:

Semiotics: is the study of signs and sign processes (semiosis), indication, designation, likeness, analogy, metaphor, symbolism, signification, and communication. Semiotics is closely related to the field of linguistics, which, for its part, studies the structure and meaning of language more specifically. However, as different from linguistics, semiotics also studies non-linguistic sign systems. (Wikipedia).

Pictograms, ideograms, icons convey some meaning by representing physical objects (or process). Roadsigns, metro maps, hazard signs, signage, wayfinding... all sorts of stuff have little images that we do not even notice that we notice. But we find the right toilet anyway (it is of course hilarious when cultural differences and misunderstandings mess that up).

Just to give you some pretty pictures, here are the icons used for the Olympics in Munich, 1972. They are certainly not inferior to more current sports imagery:

enter image description here

And here are some piss-takes on pictograms that can be pretty obscure. More over at airtoons:

enter image description here

enter image description here

enter image description here


An icon is a small image, a button is a GUI widget that responds to a mouse click.

It is common to show an icon on a button. Sometimes the 'button' drawing is also disabled so the button appears to be nothing more than an icon.

So while they are two distinct things, developers often configure buttons so that the distinction is blurred.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.