The icon of your app is one of the three defining parameters that affect conversion rates, along with price and name. But unlike these two, it’s the icon that catches the eye first. As we know, black and white is beautiful in photography, but in design it’s full-color icons that catch attention. All the elaborated graphics and the smoothly running features come only later. Therefore, a failed icon is most likely a failed app.
How can one not fail it? There are no absolute guidelines for the issue of choice. The rule is to pay attention to what matters. And with the recent mobile design trends accentuating more on minimalistic shapes than on complex drawings, the importance of color rose even higher.
When it comes to color, there are two possible situations. For established brands it’s absolutely obvious to stick to the brand’s identity that has been before the app. For mobile startups, when it all is just the beginning, the image of the brand, the product, is only being formed, which is the crucial phase. A good brand has a distinct personality and has to awake emotions in users. The very first emotions and impressions are formed with, again, color. So what are the common ‘main’ colors for app icons?
What’s In The Color?
When a brand becomes more or less known, it immediately gains strong color associations, which will last. Facebook, Twitter? Blue. Pinterest, Flipboard? Red. Evernote? Surely green. If your logo, your app icon will have one predominant color, it will carry the message, the mood, the feelings, the essence of your product. Moreover, there must be a balance between the icon standing out and getting noticed on the homescreen, and ‘overdoing’ it to annoying flamboyancy, which is also a common problem of icon design. Drawing a perfect icon is the task of a designer, while the colors will most probably be chosen by you.
Blue is commonly a major favorite among all colors. Plenty of companies use various hues of blue for logos, and as a result, app icons. It’s rather hard not to recognize the distinct hue of Facebook’s blue. The downside is that for smaller brands it’s easy to get lost and blended among the sea of blue icons. Examine your own mobile homescreen; on an average one blue occupies about a quarter of icons.
Yellow is a gorgeous color, if the hue is chosen carefully, so pay special attention to that. Sunshine, positive energy, optimism – this is yellow as we see it. If you use Springpad for notetaking, it definitely catches attention on your homescreen, doesn’t it?
Red is visually intense and energetic, and usually considered second to blue in terms of popularity. It undoubtedly means excitement and catches the eye like no other color. Red would be the least bland color on calls to action.
Purple is a touch of magic and creativity. It doesn’t have the same gender neutrality like other colors, therefore it has never held a great share – which is good actually. If you think of a fashion app, purple will be one of the regular options.
Green has rather strong and definite connotations. First – it’s the color of nature, freshness, life, and peace. Second – naturally money. The business & finance app category is rich with hues of green. Who would actually want to see a disturbing and warning red color in anything concerning finance anyway?
Orange is a very warm and friendly color, a worthy option to avoid the overused blue and red. Orange is positively energetic and not even nearly as aggressive as red. Not overused, which is also a great benefit.
White means cleanness, openness and simplicity. Although you will rather see it as a ‘second color’ in combinations, or nothing more a background to the main element of the icon. After Apple abandoned their rainbow-colored logo, their white/silver shape became even more elegant, embracing simplicity as Apple’s main policy in making products.
Black is a much-favored color in many things we see every day, be it clothing or personal tech; however, this symbol of mystery, power, and challenge is not as popular as blue or red. Nevertheless it draws attention, and the recent Opera Coast’s icon is a good showcase.
Look at other famous brands associated with the color you chose: what do you have in common? Pay attention to specific perception of colors and their meanings among different cultural audiences and in different countries. Personal preferences also play a huge role in forming judgments and opinions. It’s impossible to be liked by everyone, therefore it’s better to focus on the identity of your app. Do a poll among a number of people by giving them at least 10 icon options to choose from.
There has been done lots of psychological research on colors and perfect color combinations, and it’s the art that’s handled by good UX/UI designers. After you define the basics, they will be able to pick the right hues, match the icon with the interface, your brand’s identity, and the smooth user experience provided by your app.