How to use the psychology of colour to increase Website Conversions

Color wields enormous sway over our attitudes and emotions. When our eyes take in a colour, they communicate with a region of the brain known as the hypothalamus, which in turn sends a cascade of signals to the pituitary gland, on to the endocrine system, and then to the thyroid glands. The thyroid glands signal the release of hormones, which cause fluctuation in mood, emotion, and resulting behaviour.

Research indicates that 90% of all product assessments have to do with colour. Colour is 85% of the reason you purchased a specific product. It's a no-brainer fact of any website that colour affects conversions. Big time.

So, bottom line is: Use the right colours, and you win.

In order to really appreciate the tips below, you'll benefit from a little information on colour psychology.

Colour psychology is the science of how colour affects human behaviour. Colour psychology actually is a branch of the broader field of behavioral psychology. Suffice it to say that it's a pretty complicated field.

There are key facts of colour theory that are indisputable. In a peer reviewed journal article, Satyendra Singh determined that it takes a mere 90 seconds for a customer to form an opinion about a product. And, 62-90% of that interaction is determined by the colour of the product alone.

Colour psychology is a must-study field for leaders, office managers, architects, gardeners, chefs, product designers, packaging designers, store owners, and even expectant parents painting the nursery for the new arrival! Colour is critical. Our success depends on how we use colour.

Where should you use Colour?

Let's get oriented to our context. Since colour is ubiquitous, we need to understand where we should use these colour tips. This article discusses the use of colour in website design. Specifically, we're talking about the colour scheme of a website, which includes the tint of hero graphics, headline type, borders, backgrounds, buttons and pop ups.

Using the right colour in the right way

Colour is a tricky thing. You have to use it in the right way, at the right time, with the right audience, and for the right purpose.

For example, if you are selling bouncy jump houses - those things that kids play in - you don't want to use a black website.

For the jump house site, you want lots of bright and vibrant colours, probably some reds, greens, and maybe a splash of yellow for good measure. If, on the other hand, you're selling a product to women, you don't want to use brown or orange. Maybe that's why L'oreal uses black and white, with purple overlay, in their e-commerce homepage.

In order to success at using the right colour psychology, you need to follow these core principles:

The right way
The right time
The right audience
The right purpose

Colour tips that will improve your website conversions

1. Women don't like grey, orange, and brown. They like blue, purple, and green:

The sociological differences between colour preferences is a whole branch of study unto itself. Patel got it right when he cited the colours preferred, and disliked, by the two genders.

In a survey on colour and gender, 35% of women said blue was their favorite colour, followed by purple (23%) and green (14%). 33% of women confessed that orange was their least favorite colour, followed by brown (33%), and grey (17%).

Other studies have corroborated these findings, revealing that female aversion to earthy tones, and a prefe3rence for primary colours with tints. Look at how this is played out. Visit nearly any e-commerce website whose target audience is female, and you'll find these female colour preferences affirmed.

Men don't like purple, orange, and brown. Men like blue, green, and black.

If you're marketing to men, these are the colours to stay away from: purple, orange and brown. Instead, use blue, green, and black. These colours - blue, green, and black - are traditionally associated with maleness. However, it comes as a slight surprise to some that brown isn't a favorite pick.

3. Use blue in order to cultivate user's trust:

Blue is one of the most-used colours, with good reason. A lot of people like blue. The literature on blue will give you messages like:

The colour blue is a colour of trust, peace, order, and loyalty
Blue is the colour of corporate America and it says: "Chill, believe and trust me, have confidence in what I'm saying.
Blue calls to mind feelings of calmness and serenity. It often is described as peaceful, tranquil, secure and orderly.

There is wide agreement in the research community on the psychological effects of the colour blue. Its subtle message of trustworthiness and serenity is true. You can use this to your advantage on your website and landing pages.

The world's biggest social network is blue. For a company whose core values are transparency and trust, this probably is not an accident.

A company that serves as a conduit for billions of dollars, PayPal, also prefers the colour blue. Chances are, this helps to improve their trustworthiness. If they were to try, say, red or orange as the theme colour and branding, they probably wouldn't have the same level of conversion. Blue is in fact, a colour heavily used by many banks.

Although blue is pretty much an all-round great colour, it should never be used for anything related to food. Dieters have used blue plates to successfully prevent them from eating more. Evolutionary theory suggests that blue is a colour associated with poison. There aren't very many blue foods - blueberries and plums just about cover it. Thus, never use blue if you're selling foodie stuff.

Yellow is for Warnings.

Yellow is a colour of warning. Hence, the colour yellow is used for warning signs, traffic signals, and wet floors.

It seems odd, then, that some colour psychologists declare yellow to be the colour of happiness. Business Insider reports that " brands use yellow to show that they're fun and friendly". There is a chance that yellow can suggest playfulness. However, since yellow stimulates the brain's excitement center, the playfulness feeling may be simply a state of heightened emotion and response, not exactly sheer joy.

Colour psychology is closely tied to memories and experiences. So, if someone had a very pleasant experience with someone wearing a yellow shirt, eating at a fast food establishment with yellow arches, or living in a home with yellow walls, then the yellow colour may cause joy by memory association.

One of the most-cited "facts" about the colour yellow is that it makes babies cry and people angry. To date, I have not found any study that backs up this claim, even though everyone is fairly comfortable repeating it. I even read that the colour yellow causes nausea, though I'm doubtful about this.

Whatever the case, it does seem true that yellow activates the anxiety center of the brain, as reported by some colour experts. A heightened anxiety level during any website experience is never a good thing, unless it comes in small doses. Thus, a yellow call to action may create just a touch of anxiety that's needed to make them click the desired call to action.

Use yellow in small doses unless you want to cause unnecessary anxiety.

Green is ideal for environmental and outdoor products

Perhaps the most intuitive colour connection is green - the colour of outdoors, eco-friendly, nature, and the environment. Green essentially is a chromatic symbol for nature itself.

Apart from its fairly obvious outdoorsy suggestiveness, green also is a colour that can improve creativity. Labeled "the green effect", one study indicated that participants had more bursts of creativity when presented with a flash of green colour as opposed to any other colour.

If the focus of your website has anything to do with nature, environment, organic, or outdoors, green should be your colour of choice.

Green isn't just about nature, though. Green is also a good call to action colour, especially when used in combination with the "isolation effect", also known as the von Restorff effect, which states that you remember things better if they stand out. You remember the Statue of Liberty because it's big, tall, green, and there aren't a whole lot of them in the New York harbour. In colour psychology, the isolation effect occurs when a focus item, such as a conversion step, is the only item of a particular colour. The technique works wonders for calls to action, and green is an ideal choice.

The word "green" itself is a buzzword for environmental awareness and appreciation. Using the word and the colour itself can lend and environmental aura to your website, improving your reputation among those who are passionate about environmental concerns.

5. Orange is a fun colour that can create a sense of haste or impulse

The positive side of orange is that it can be used as the "fun" colour. According to studies, orange helps to "stimulate physical activity, competition, and confidence". This may be why orange is used heavily by sports teams and children's products. uses orange in their "limited time offer" banner. The colour suggests urgency, which makes the message more noticeable and actionable. It makes sense. Orange means active. Orange means fun. Orange means togetherness. Because it's a loud and warm colour. However, orange can be slightly overwhelming. A research paper advises: "Orange will be used sparingly to bring your attention to something, but not so much as to overwhelm the actual message of the advert."

Sometimes, orange is interpreted as "cheap". Compare orange to black, which is seen as the colour of luxury. Forbes posed the question "Does orange mean cheap"? in an article on the "Effect of Colour on Sales of Commercial Products." The resounding answer was "yes". If your product offering is cheap, or if you want it to be seen as such, orange maybe a good choice.

6. Black adds a sense of luxury and value.

The darker the tone, the more luxurious it is, says our internal colour psychology. An article from Life script describes black as "elegance, sophistication, and power", which is exactly what luxury designers and high-end e-commerce sites want you to feel. The article goes on to describe black as the colour of "timeless, classic" which helps further explain the use of black in high-value products.

Black is the name of the game, so if you're selling high-value luxury consumer items on your website, black probably would be a good choice.

7. Use bright primary colours for your call to action.

In strict testing environments, the highest-converting colours for calls to action are bright primary and secondary colours: red, green, orange and yellow.

Darker colours like black, dark grey, brown, or purple have very low conversion rates. Brighter ones have higher conversion rates.

Women's Health uses a bright mauve-tinted shade for their popup call to action. They've got the female-associated purple / pink tint going for them, along with a bright tone.

Some of the best conversion colours are the "ugly" ones - orange and yellow. An article on states: "Psychologically, the "anti-aesthetic" colours may well capture more attention than those on the aesthetically-correct list". Since the goal of a conversion element is to capture attention, then you may do just fine with that big orange button. Or yellow.

8. Don't neglect white.

In most of the colour psychology material out there, there is a forgotten feature. Maybe that's because colour theorists can't agree on whether white is a colour or not. I don't really care whether it is or not. What I do know is that copious use of white space is a powerful design feature.

White is often forgotten, because it's primary use is as a background colour. Most well-designed websites today use plenty of white space in order to create a sense of freedom, spaciousness, and breathability.


The Internet is a colourful place, and there is a lot that can be accomplished by using colour in the right way, at the right time, with the right audience, and for the right purpose.

Naturally, this article leads to questions about making changes in your company's context. What about if your company has a specific colour style guide? What if the logo colour dictates a certain tint? What if the lead designer dictates colour requirements? How do you deal with that?

You may not be in a position to rewrite your style guide and pick your own website colour palette or font colours on the email template. So, how can you use colour psychology in these situations? There are a few options:

* If the colours really suck, campaign for change. In some situations, you may need to make a difference. If you're a high heel designer selling to upscale women, but have a crappy orange logo, share your concerns with the decision-makers. People sometimes make silly colour decisions. Kindly show them why and how a killer colour scheme can make a conversion difference.

* Use psychology-appropriate colours that match the existing colour scheme. Sure, you need to adapt to the colour scheme, but you can still use a splash of strategic colour here and there. Let's say, for example, that you have a blue-themed website. Fine. You can create a popup to harvest email addresses, and use a bright yellow button. The button is psychologically-appropriate, and it doesn't do damage to the company's colour branding.

The more freedom you have in your colour scheme, the better. There are some solid takeaways as you implement colour psychology into your website:

* Test several colours: Despite what some may say, there is no right colour for a conversion text or button. Try a green, purple, or yellow button. Explore the advantages of a black background scheme vs. a white background. Find out which works best for your audience and with your product.

* Don't just leave colour choice up to your designer: I have enormous respect for most web designers. I've worked with many of them. However, don't let your designer dictate what colours you should use on your website. Colour is a conversion issue, not just an "Oh, it looks good" issue. Colour aesthetics is not everything. Colour conversion effects are important! You should be heavily involved in the colour selection of your landing pages in order to improve your conversions.

* Avoid colour overload: I've just spent over 3, 000 words telling you how important and awesome colour is. Now, you're going to go out and colour something. But don't go overboard. Remember my final point. I put it last for a reason. White is a colour, and it should be your BFF colour, too. Reign in your colour enthusiasm with a whole lot of white. Too many colours can create a sense of confusion.

Author: Jeremy Smith