We’ve all seen the use of colors in movies. The bad guys are draped in black, the good guys in white. And think about baby clothes! But does this logic follow for websites? Are there best colors for websites and can the color of your website influence how people perceive your business?
The short answer is, yes they can! The right color scheme will not only influence how your brand is perceived but also directly influence your sales.
Keep reading this article to see the evidence, to learn why and to discover what is the best color combination for your website.
Evidence that color influences sales
Let’s take a look at two different examples. First, we have color being used in a way that was effective and thus increased sales. Second, we have color being used in a way that was not so effective and in the end resulted in some pretty unhappy accountants.
EXAMPLE 1: A notable A/B test conducted by Hubspot showed that simply changing the color of the CTA button on a client website from green to red resulted in 21% more people clicking the red button. That’s 21% more conversions and potentially 21% more final sales down the line. A fairly significant increase for simply changing the color of some buttons.
Example 2: If you are a football fan, you may be familiar with the famous Cardiff City Football Club rebrand. As part of a £100 million investment in an attempt to appeal to a more international market, owner Vincent Tan decided to change the traditional ”Bluebird” club colors from blue to red (with this kind of genius at work, you can probably see where this is headed).
An overwhelming amount of fans did not take to the change,. This resulted in protests and season tickets had to be returned. Brand loyalty was severely weakened. Three years later, the club resorted back to their original blue colors. Not quite the intended result given the hefty price tag.
The answer to our question of why color influences sales lies in color psychology.
What exactly is Color Psychology?
Color psychology refers to how colors affect human behavior and develop meaning based on our experience, culture and biology. Although it is not as simple as saying yellow means happiness, we cannot deny the fact that color has a sizeable impact on our perception of things.
In fact, color psychology tells us that 85% of the reason people purchase products is due to color. Moreover, it takes a mere 90 seconds for a customer to form an opinion about a product. Since your website is likely your storefront, if you get the color of your landing page wrong, you seriously risk the financial viability of your business.
Another important aspect of color psychology is how appropriate the color is compared to the product itself. For example, if you are a rugged outdoor footwear company, you may not want to use glittery pink as your primary color!
Despite the various reasons people interpret colors differently, everyone generally shares a similar set of meanings. See the list below for a general rule of thumb for each color.
What do different colors “mean”?
As previously mentioned, colors can have different interpretations depending on your culture, etc.. For example, white is used to signify marriage in western culture, but in southwest Asia, it can mean death. It’s important to keep this in mind as we discuss the use and meaning of different colors.
The color red is a powerful and intense color. It is often associated with excitement, arousal, love and warmth. It also known to stimulate our appetite, which is why red is one of the best colors for websites for food and beverage brands.
Red is also associated with blood and danger. Therefore, the context, target audience and purpose for which you use red should be looked at carefully.
Like red, you can draw attention with orange. We see this in traffic signs and CTA buttons. The sun, warmth and friendliness reminds us of orange. This is why it is one of the most inviting colors to use in websites.
Orange is also known for being associated with budgeting and good value. According to company documents, Home Depot picked the bright orange logo to convey a sense of affordability to its customers. There is even a legend that they asked Pantone to create the orange color just for them!
2019 Pantone Color of the Year
The 2019 Pantone Color of the Year incorporates shades of orange. The color is attention grabbing, yet warm and inviting when balanced with different combinations and shades.
Have questions about how to incorporate the Pantone Color of the Year into your website? Contact us today for a free consultation!
Yellow is the color declared by color psychologists to be most associated with happiness. Therefore, it seems odd that yellow is also used for warning signs and traffic signals. This could be that as the brightest color in the spectrum, yellow is very stimulating and can result in a range of different emotions.
If using yellow as a primary color in your website be cautious not to use too much, or pick a more appeasing shade. Too much yellow can be overstimulating and turn away potential leads.
The Corona Sunsets Festival website is a great example of the color psychology behind using yellow. The splash page above is almost entirely yellow, captivating your attention. However, within seconds the page automatically changes its layout and employs the rest of the brand’s colors (below). This avoids using too much yellow and aligns perfectly with Corona’s bright, happy personality.
One of the favorite colors of men, green signifies health, growth, eco-friendliness, creativity and stability. Green is one of the most naturally occuring colors in our environment. This is why many health conscious, environmental and outdoor brands use green as the primary color in their logos and websites.
The term ”green” itself is a symbol for environmental awareness and activism. Therefore, using the word and color together will clearly define your eco-brand’s identity.
Blue is the worldwide favorite color among men and women of all ages and is one of the most widely used colors, for good reason. It brings to mind serenity, trust, security and order. It is especially popular amongst insurance and other financial services companies.
In fact, nearly 50% of the 100 largest companies in the world have some type of blue in their logos! Some of these companies include:
- Morgan Stanley
- Prudential Financial
- Goldman Sachs
If you are looking to cultivate trust in your customers, blue is one of the best colors for websites.
Purple is the color of royalty, luxury, power, wisdom, and creativity. It shares blue and red color psychologies, giving it the intensity of red with the thought provocation of blue.
As with other colors, different shades have different meanings. For example light purple can have strong feminine power, while a bright purple can convey royalty and richness. Purple is one of the least favorite colors of men. In fact, if your website is geared towards men, we recommend avoiding using the color purple altogether.
It is also a favorite amongst young children, which is one of Cadbury’s primary target audiences. You can clearly see the color in action by looking at Cadbury’s overtly purple homepage above. Cadbury saw this color as so important to their brand that they trademarked it. Nestle then challenged this trademark, resulting in a legal battle that lasted for years. So if you are worried you are spending too much time thinking about your website’s colors, you are not alone.
Purple is the hardest color in the spectrum for the human eye to see, which is likely why so many men (who are often color blind and don’t know it) dislike it. Because of this difficulty, be sure to use an effective secondary color to help the necessary elements of your website stand out.
In pop culture, pink is the feminine color. It is the color that most quickly comes to mind when we think of girls’ and women’s clothing brands (i.e. Victoria’s Secret ”PINK”). It is also brings to mind calmness, affection, hope and comfort.
But in fact, pink is the favorite color of only a small amount of women. And let us not forget, Victoria’s Secret has been marketing to men for years. So if your primary target audience is women, you should instead focus on using proven favorites such as shades of green, blue, and purple.
Thomas Pink Case Study
What do we get when we use a color outside of its normal application? As pointed out in Zee Bheev’s When Boys Wear Pink, challenging traditional color norms can actually make you appear more confident. In this case, with men wearing pink as a ”power move”, it goes to show that how and where you use a color is just as important as it is aesthetically pleasing.
For instance, Thomas Pink, a reputable men’s clothing brand, built its brand identity on just that idea.
Black is perhaps the most popular color in retail. It is easy to read. But just as importantly it conveys sophistication, wealth and luxury.
Take a look at the luxury brand logos below. Now imagine if Yves Saint Laurent switched to an orange logo, or Burberry switched to a blue logo. How would your perception of these brands change?
There is a striking similarity not only in these luxury fashion brands, but in luxury brands across a variety of industries. An excellent example of using black to denote wealth, quality and a high end product is the Rolls-Royce Adamas Black Badge. It is a limited edition model highlighted for its various dark features.
Take a look . . .
Brown is the least favorite color amongst men, and the second least favorite color amongst women. Thus we usually don’t recommend using brown in your website unless you’re selling mushrooms. However, depending on its use, brown can have some beneficial qualities for your website and brand.
Used sparingly, brown can evoke feelings of reliability, strength and earthiness. In large quantities it can seem vast, bland and straight up boring. Which again stresses the importance of using colors in moderation, with the right complementary colors and always in the right context.
The United Parcel Service (UPS), which is relied upon for its timely delivery of packages, has been using its recognizable ”big brown” color since 1916. The color incites the reliability and timeliness the company strives to provide its customers.
Bloomingdales Case Study
Brown is considered so boring that the chic Upper East Side (of Manhattan, NYC) retailer Bloomingdales made their shopping bags brown to appeal to old money, who in general don’t like flashy logos. In fact, their shoppping bags don’t even carry the name Bloomingdales. In one of the most interesting stories in advertising, the brandless brown bags became associated with those “in the know,” which made the bags extremely chic.
They got a double hit of success during the 21st century. People now associate the brand with being eco-friendly. Morale of the story: Know your customer!
Color psychologists debate on whether white is actually a color, or the simply the absence of color. But political color correctness aside, white is one of the best colors for websites when used correctly.
Take Google, for example. It is the most highly trafficked site in the world and is almost completely white. They are exploiting the fact that ample white space improves the overall user exeprience (UX) of your website. Your content reads better, the page feels less cramped and your visitors can navigate more freely.
If you have a business that caters to kids, you will know that many kids say that “rainbow” is their favorite color. They actually consider all the colors together a single color.
If you are building a site to appeal to kids, go a little crazy with the color! You can even use all the colors in the spectrum. Just make sure they are bright.
How to choose the right color for your website
Choosing the best colors for websites can seem like an overwhelming task, but using the following tools and tips will help you jump start the process.
Know your customer
If you haven’t done so already, take the time to create buyer personas for your target market. Here is an excellent guide from Hubspot that teaches you how to do this. It even gives you templates.
At Bespoke Digital Solutions, we believe your website should be targeted to attract your ideal customer. Recall the Thomas Pink and Bloomingdales example above. Those worked because they knew their customers so well.
Many small business owners make the mistake of creating a website that they like and use colors that appeal to them, rather than their customers.
Here is a little cheat sheet to help you determine which colors appeal to your target demographic:
- Women only sites: purple, blue and green
- Men only sites: black, blue and green
- Kids: purple or rainbow
- Older demographics: As people mature they like colors of shorter wavelengths (blue or even white)
Think about your brand’s emotion
Every great salesperson knows that most people buy based upon emotion. What emotion do you want your brand to instill?
Here is a little cheat sheet to help you determine the emotions different colors elicit:
- Trust, intellectual prowess: blue
- Luxury: black
- Fun: yellow, pink if used correctly
- Peace or comfort: blue, green and white
- Health: green, brown if used sparingly
- Hunger: red or yellow
- Passion and/or love: red
- Value, impulsivity, creativity: orange
- Dependibility or discreetness: brown
Select your colors
With a nod to fashion design, a good rule to follow when selecting the best colors for websites is the 60-30-10 rule.
In the website world, that is:
- 60% of the website with the primary color. We recommend choosing one that appeals to your target demographic.
- 30% of the website with a color that compliments your primary color. We recommend using one that conveys the emotion you want your brand to instill.
- 10% of the website with the accent color- used for calls to action (CTAs) and other points you want to emphasize. We are currently a big fan of Pantone’s color of the year, Living Coral, to make your site seem bright and up to date. Plus coral looks great with almost every color.
It is possible to use more than the 3 colors allowed by the 60-30-10 rule, but we do not recommend it unless your website is marketing towards children or if a wide range of colors is integral to the site’s functioning.
If you’re not an expert on color theory and don’t know what colors will look good together, don’t worry. There are a number of website color selection tools to help you. And we’ve collected some of our favorites to help you pick the best colors for websites:
Overwhelmed trying to find the best color for your website? Arrange a FREE CONSULTATION TODAY. We can solve the problem for you!
In conclusion, what have we learned? Firstly, people’s interpretation of color depends on a variety of factors, but in general a few truths stand in common.
Secondly, how color can send potential and existing customers running for the hills, or how they can help you generate new ones and boost your sales.
Lastly, the best colors for websites can send very specific messages about your brand.
The most important thing to remember is to focus on your target market. Use colors that appeal to them while simultaneously conveying the emotion you want your brand to elicit in them.