Which Color Converts The Best?

Which Color Converts The Best?

Color is an essential part of how we experience the world. But do colors really matter for conversion optimization?

Everything in our world is made up of things that are of various color.  Different colors can lift us up, or bring us down. There is also a psychological side to colors – certain colors are said to be associated with different qualities and emotions. Can come colors make our website convert better?

In different cultures different colors can mean contradicting things. For example, white is the color of mourning and death in Chinese culture, but the color of death in Brazil is purple. Yellow is sacred to the Hindus, but represents sadness in Greece and jealousy in France. In North America, green is typically associated with jealousy. People from tropical countries respond most favorably to warm colors; people from northern climates prefer the cooler colors and so on.

It’s said that in North-American culture the color blue creates feeling of trust, but also encourages appetite. Green supposedly means nature, freshness, growth and money. Yellow brings with it sun and sunshine plus happiness.

For sure there is some truth to all of this, but can we translate this to lifting conversions?

When you’re ready to move past testing button colors and get some real gains, enroll in ConversionXL Institute to become a conversion optimization master.

Experiments with color usage

Red can make you a winner

Almost universally, red means stop. Red means danger. Red means hot. And analyzing the results in the 2004 Olympics, researchers have found that red also means dominance.

They examined boxing, taekwondo, Greco-Roman wrestling and freestyle wrestling, basically all of the one-one-one sports in the 2004 Olympics. In those sports competitors are randomly assigned red or blue outfits, so no rigging is possible.

wrestling

Image credit

In 16 of 21 rounds those wearing red won. Similar tendencies were found in the 2004 European Soccer Championship. Researchers are careful to point out that the effect is subtle at best. And that red can be deciding factor only among evenly matched competitors – but it still exists.

We find that wearing red is consistently associated with higher probability of winning,” University of Durham researchers Russell Hill and Robert Barton write.

… and a loser

Researchers at the university of Rochester have found that the color red can also keep us from performing our best on tests. In their experiments they wanted to find out if the perception of red will have any effect on results of important tests such as an IQ test or a major academic exam. In academic context color red is traditionally associated with marking errors on school papers.

Results

Four experiments that they carried out showed that just a brief perception of the color will have negative impact on the results. “It leads people to do worse without their knowledge,” says Elliot (one of the authors), when it comes to academic achievement.

The findings show that “care must be taken in how red is used in achievement contexts,” the researchers reported, “and illustrate how color can act as a subtle environmental cue that has important influences on behavior.”

Color and the taste of hot chocolate

cocoImage credit

Turns out that the color of the container where the food and drink is served contributes to the aroma and taste of your food and drinks. That is conclusion in the case of drinking hot chocolate explains Betina Piqueras-Fiszman, researcher at the Polytechnic University of Valencia (Spain). Along with her colleague Charles Spence, from the University of Oxford (UK).

The experiment

The experiment involved 57 participants in where they had to evaluate samples of hot chocolate served in four different colors (white, cream, orange and red) of plastic cups. They were all the same size, and all of them white from the inside.

Results

Results reveal that the flavor of hot chocolate served in orange and cream colored cups was judged better by the participants. However, the sweetness and the aroma was judged to be in the same lines in all the cups no matter the color.

“There is no fixed rule stating that flavor and aroma are enhanced in a cup of a certain color or shade,” recognized Piqueras-Fiszman. “In reality this varies depending on the type of food, but the truth is that, as this effect occurs, more attention should be paid to the color of the container as it has more potential than one could imagine.”

In other experiments it has been demonstrated that strawberry mousse appears to be sweeter and more intense on a white plate compared to a black one.

Best color for buttons

This is all well and good to know that red might just make your chances of winning in sports better and that hot chocolate tastes better in a certain color cup but what has this anything to do with conversions on the web? Does red, really, give an advantage in conversion?

Green vs red button war

There has been something of a controversy going around in the interwebs about which button color converts better. Unbounce declared that the future of call-to-action buttons is BOB. That stands for Big Orange Button.

There’s a number of interesting A/B testing case studies where orange, in our case mostly red, button was up against competition from various other colors including green.

When you think about then green is mostly associated with positive emotions. When the traffic lights turn green it means you can drive. Vice-versa with red. That color is mostly associate with negative emotions. With traffic lights example when the lights turn red you stop.

So what you think?

Which one wins. Green or red, red or green? Read the following case studies and find out.

Case study 1

dmix

Dmix wrote about about one of their projects in which they tested green and red button colors. In their testing with 600 subjects they found that conversions increased by 34% when they used red button.

34% is a decent lift in conversion. 1:0 for red buttons.

Case study 2

hubspotImage credit

Next test comes courtesy of HubSpot. They ran similar test with green and red buttons on one of their clients web page. They ran the test over a period of a few days worth of traffic and in total had over 2000 subjects visit.

Their result was that red button outperformed green button by 21%. 2:0 to red button.

Case study 3

visual

Image credit

Third test comes courtesy of Visual Website Optimizer. Their client was an eCommerce site selling mobile phones and accessories. They tested Buy Now button colors on their site. In competition were white button with green text, green button with white text and red (darker orange) button with white text.

And the winner was… You guess it – it was the red button, this time with 5% better conversion. 3:0 for the red button

Case study 4

monetateImage credit

So far we’ve seen total dominance by the red button. So let’s change things up. This time lets see how it does against a blue button courtesy of Monetate. In their tests, surprisingly, the blue button won by producing a 9% lift. It might have been an anomaly, something must have been wrong with that test…

Anyhow, the final results are that red button wins 3:1. It’s safe to say that, based on various A/B testing, the best color for call-to-action buttons is RED! Yay, victory…

Or is it?

Didn’t Peep write the following about colors in web design in this post:

I liked this tweet by Naomi Niles:

Naomi tweet

I couldn’t agree more. This kind of narrative gives people the wrong idea about what testing is about. Yes sure – sometimes the color affects results – especially when it affects visual hierarchy, makes the call to action stand out better and so on. But “green vs orange” is not the essence of A/B testing. It’s about understanding the target audience. Doing research and analysis can be tedious and it’s definitely hard work, but it’s something you need to do.

In order to give your conversions a serious lift you need to do conversion research. You need to do the heavy lifting.

Serious gains in conversions don’t come from psychological trickery, but from analyzing what your customers really need, the language that resonates with them and how they want to buy it. It’s about relevancy and perceived value of the total offer.

The last case study

Let’s take a look at one last example which will make all of this make whole lot more sense.  RIPT Apparel tested color of their buy now button to see if it makes any difference to their bottom line.

This is the original version:

original Image credit

And this the new button:

green buttonImage credit

To no great surprise, conversion numbers went up. Now looking at the previous cases one could say that if they changed the button to red it would convert even better.

Well, not quite.

Take a look at the original again, do you see anything weird. Or something that should be there but isn’t?

Missing button

The original is missing a button! The “Buy Now” call-to-action simply gets lost in the design – you can’t see it.  With the new button you can clearly see it, color makes little to no difference. And this, unfortunately, is how the great controversy of red/orange buttons got started. You look at those tests and results and you see amazing results that tell you that this color or that color converts the best.

That is, until you look closer. More often than not they reveal something similar e.g. there was no previous button or the button is just so much more prominent, it stands out from the rest of the page and thus converts way better.

Monetate (authors of the blue vs orange button test) write this about it:

But, if you dig into the results, you’ll see that orange buttons were almost always tested against a control of no button at all. In cases like these, it’s hardly a surprise that orange buttons make a difference. Of course they do … when compared to no button at all! Practically any button will make a difference, regardless of color.

In the case of RIPT Apparel, they tested one last final version – this time a yellow one:

yellow buttonImage credit

With the latest test conversions went up a further 6.3%. So yellow beats green? No, no, no.

Color makes little difference on its own

The color of the button has little to no effect on it’s own. What is more important is how it changes the visual hierarchy of the whole page, how it makes the call-to-action stand out. Plus additional information and wording of the button itself.

It’s also what we’re used to. Bing increased their revenue by $80 million dollars by finding the exact color of blue for their links. Why is that? It’s because people are used to links being blue. When WWW first came to be, blue was the color of links. Microsoft engineers working on this also admitted this: “…it was a shade of blue quite similar to the one used by Google.

There is no best color for web pages that makes them convert better. I’ll say that again: there is NO best color for conversions.

In the yellow button’s case, they also added  emphasize of time limitation ($10 only for 24 hours) to the button which has been demonstrated time and time again to lift conversions. In the case of Bing and blue, it was the power of convention in action.

Back to HubSpot

The same can be said for the HubSpot’s example. Take a look at it again:

hubspotImage credit

Look at the original green one on the left and the new red one. Do you notice anything that might contribute to the red button being a better choice? Something in the overall design of the page?

Something like – oh I don’t know – using green as one of the main colors on the site? Bingo! Green is the dominant color on the whole page. And what happens when you add a green button to the mix?

It won’t stand out! They could have tested it against pretty much any other bright color and would have seen the same kind of “amazing” conversion results.

To HubSpot’s credit they to say in the case study that they “cannot generalize these results to all situations. The most we can say is that they hold for the conditions in which they occurred: in this page design, on this site, with the audience that viewed it.”  But still, green button on a page with dominant green design, really?

Conclusions

Color usage does matter, sometimes a lot. But saying that one color converts better than another is simply stupid. There is no universal best color. What works on one site, doesn’t necessarily work on another.

Visual hierarchy matters and making your call to actions stand out matters. So “green vs red” is not so much about the color, but “does the important stuff stand out enough” and if not, how can we improve the situation.

Featured image credit

Post by Ott Niggulis

Join the Conversation Add Your Comment

  1. Peep, I was seriously worried for a minute. Thank goodness you pulled through for me.

    1. All is good, no need to worry.
      And this is Ott, author of this piece.

  2. Well, I think color is an important factor. But marketers don’t need to be obsessed with it!

    Factors affecting color effectivity are color contrast and color complementarity.

    1) Color contrast. This element is important because if the button color does not get the attention of the potential customer you don’t get the sale/sign-up…

    2) Color complementarity. If the only factor on the equation was the color contrast, we would chose the most striking and flamboyant color. But reality tell us that most of the time this is not the right answer. Color contrast must be coherent with the rest of the colors used in your website.

    Therefore, use a high contrast color, complementary with your website color chromatic range.

    BTW, Great website Peep!

    PD.- The article talks about order button color tests and does not make any reference to the most tested website on earth (Amazon). Their buttons won all the tests they made using different color combinations.

    You can see them at:

    http://g-ecx.images-amazon.com/images/G/01/common/sprites/sprite-dp-2._V395767383_.png

    1. Contrast and complementary matter for sure as well as various other things.

      The idea behind this writing was to make people realize that while colors of your buttons and other elements are important, it’s the site as a whole that needs to make sense first.

  3. I was at a meeting with Shane Cassells, Online Conversion Specialist, NACE at Google as he looked over our site.

    Google tested 4,000 shades of blue prior to picking the button on the search

  4. I wonder how many people came to this post hoping you had the answer that would help them generate millions of dollars.

    If you think about it for a second and you asked 10 friends what their favorite color was you might get a majority but more than likely you would get 2 to 3 choices of colors. You can apply that to this theory of button colors. Not everybody likes green or red or blue or yellow. There has to be a call to action and in the case of buttons or links it is making them stand out from the content so people have ease of use to click.

    Terrific article. Thanks for sharing.

    1. Well, for sure lots of people clicked and were hoping to hear me write that color X is the best. But, you know, hopefully there is a bit less confusion now about the whole “this is the best color ever” situation. A bit more clarity.
      Yeah it requires more work but, what doesn’t?

  5. Nice post! I was going to write something pointed and long-winded about how Red Vs. Green is a worse debate than Gun Control in the US, but realized that Francisco Moriones made many of the good points that I would have. In addition to Color Contrast and Color Complementarity, I’d add Color Appeal and Trust. If your website makes good use of more earthly colors, then having a bright pink button will look on the cheesy side and might not appeal to your audience.

    Cheers!

    1. Trust and color appeal are a bit tricky – different people view them differently so there’s possibility there to make mistakes. But in general yes, you have to take into account readability and a host of other things as well… So is not easy, but definitely worth it.

      As with pink buttons, would be interesting to see a design that could pull that off successfully :D

  6. Peep!
    I couldn’t agree with you more. CRO is all about digging deeper, finding out what is important to people before they buy. Making things clear to users. Creating a great user experience and using smart calls to action. as you said, it’s about relevancy and perceived value of the total offer.

    If you do that right, you will win! Awesome post!

    Best,
    Darren

    1. Glad to hear you got some value out of it, thank you.

      If you’re wondering who am I , then I’m Ott – author of this post ;)

  7. Brilliant article. I’m very impressed with the blogs on this site.

  8. Excellent article! I enjoyed the previous article on this subject, but this one was far more enlightening on the influence of color and conversions. Thanks Peep!

    1. Glad to hear you found value from this article – while the previous one was written by Peep, this one was from me ;)

  9. Interesting. I wonder if red keeps people from performing well on tests as it’s often used to point out mistakes and to give a bad mark on homework? Could be a subtle correlation in the mind.

    1. It definitely does! The second research on the color red (non conversion based) concludes pretty much that.

  10. As a designer in an in-house web team for a large UK publisher I was repeatedly frustrated when the whole “orange button” thing was doing the rounds. Time and time again I had to point out that it was really dependant on the rest of the page. I found using Easyjet as an example of where an orange button wouldn’t stand out!

    1. Peep Laja

      I hear you! Every time I see the BOB recommended as treatment, I cringe.

  11. Great article – after all is said and one and all things being equal, red will generally be the correct choice for a call to action button.

  12. Great article. Quick question, any reason why your email signup popup on the right side of your site (13 Ways to Increase Your Conversion Rate – Right Now) isn’t using a red (or similar) button based on your findings?

  13. This was the best article I have seen on the psychology of color choice directly aimed at “Buy” buttons. I just recently started A/B testing both colors in some of my remarketing campaigns and appreciated the effort that went into the post as it was exactly what I needed.

  14. Great Article. I suggest at least two other factors should be considered when analysing results of colour tests such as these. Colour tone affects legibility. For example, red has a darker tone than green so white lettering on buttons of these colours is easier to read on the red button and the brain has less work to do (fluency). So I would expect better results from red all other things being equal.
    Secondly, significant proportions of the population are colour blind and may struggle to interpret some colour combinations. This is statistically worse for men than women. So, if your site is about gender specific clothing for example, you may have to factor this in any analysis of results you do.

    1. Red also appears to recede in relation to other colors, so it makes the white letters stand farther out. Try putting red text on a white button and you can see the inverse of that.

  15. I think the whole “Green vs Red” is the most wrong assumption I always do. I still can’t believe that Red outperform Green especially on Checkout pages.

    This shows that you always need to run your tests and don’t depend so much on your assumptions. You need to think and test “out of the box”.

  16. So cool to come across an article like this from a friend like that!

  17. Great and very comprehensive post.Colors are very important, but your website proves that the most important thing, however, that something like this can be useful to read.Thanks.

  18. Good collection of research here. I’m not surprised red converts better than green though I came to this article curious about blue vs red which wasn’t answered conclusively. Perhaps for a service requiring some degree of trust, blue would work well.

  19. My company insists that the button color be part of the “primary palette”, meaning it’s always competing with other elements of the same color on the same page. When I suggest another color in order to create contrast, the feedback is “That color is off-brand”.

    While understanding that placement, size and content also play huge factors, is there any hard evidence I can point to that says “Stop making your buttons the same color as other stuff on the page”?

  20. I came here after a google search for tests on RED vs ORANGE buttons. Strange that they always win when put up against blue or green…but so far I haven’t seen any split tests between the 2 WINNERS (which seem to be the “BOB” Big Orange Button (“Belcher button”) with DARK BLUE TEXT and the RED with WHITE TEXT.

    Those are the 2 that always win the split tests..Has anybody tested them against teach other and published the results??

    Thanks!

    1. Peep Laja

      Hannah, did you read the post?:) There are no buttons that always win. It’s a myth certain infomarketers want you to believe. Get out while you can!

  21. Great article, Ott. You start out leading readers to believe that red converts the best, and then you bring up interesting perspective to get readers to think more deeply and realize that color is only one piece of the puzzle.

    It’s been a while since I’ve read a well-written piece like this.

  22. purple is not the color of death in Brazil!!!

  23. Another BS click bait article asking a question and then answering it by saying there is no answer. Thanks Internet.

    1. Peep Laja

      Ha! Alas that is the truth – there is no universal best color. People ask this stupid question – but they shouldn’t! So this article sets them straight – stop looking for the unicorn, and think in terms of contrast and visual hierarchy.

  24. Purple is not associated with death in Brazil. I’ve been living here for a few decades and I’ve never heard of that belief, not even for minorities. The article does have some good conclusions though.

  25. I tend to keep things simple and rely on my gut feeling about visual factors but that is indeed just a part of the mix. The overall conclusion of your article calms my nerves as well. Thanks for sharing and outlining some interesting results Ott.

  26. I think the most basic thing is being overlooked here with this “green vs red” argument.

    When you’re creating a landing page or buy button it’s not about color as much as it is about CONTRAST.

    Your button needs to be in STARK CONTRAST with its backdrop and should be the loudest thing on the page.

    The idea is to get people’s attention so they know WHAT and WHERE to click.

    Couple that with a color palette that speaks to your audience and you’re in conversion city.

    That alone will do tons more for conversions than just making these two colors battle it out all the time.

    If everyone is always using Red or Green, the colors will eventually lose their effectiveness and as soon as someone comes to a website that has a PURPLE or CYAN button, it’ll likely get clicks JUST because it’s different and a breath of fresh air.

Comments are closed.

Current article:

Which Color Converts The Best?