Which Color of CTA Button Converts the Best
Everyone seems to have an opinion on button colors. Across dealership websites, I’d say the general rule appears to be ‘make the buttons invisible’ – they don’t stick out at all, and they tend to simply ‘match’ the color or theme of the brand or website with no regard to whether that’s good or it’s costing you thousands in lost opportunity.
Colors matter, but probably not for the reasons you think.
No individual color is better than another. It is really the color of the button in relation to its surroundings that matters.
Our Associations With Color
We all have different associations when it comes to colors. It could be different values or emotions that we get from them.
Different cultures also see the same colors differently than others. There are some truths to these associations in the world, but do they translate to your website, to your SRP/VDP or landing pages?
Red is a hot topic when it comes to color. It means a lot of different things to a lot of people. Most notably you’ve heard red means stop or red means danger. We see this in hazard signs, stop signs, traffic lights, do not enter signs, etc.
Or maybe red is about excitement, passion and of course love (Valentines Day anyone?) ❤
There are a lot of studies done about athletes, who wear the color red, performing better. Literally the color of their outfit can be used to predict the winner in an event. (Google it!)
So what are we to think of red if it means all those things; what does that mean for our CTAs?
The internet has been littered with tests over the years all claiming they had determined the ‘best’ call-to-action color.
Unbounce, a very popular landing page creation service, declared the BOB (Big Orange Button) to be the winner.
Let us Look at some case studies.
Case Study #1
Hubspot – a very popular inbound marketing company and software service, did a test.
The original on the left with the variation on the right. The red CTA button performed 21% better than the green button, tested over 2000 visits to each variation. That’s an incredible difference with just a color change. Imagine you could increase your conversion rate by 21%?
Case Study #2
Here is another test performed by Virtual Website Optimizer (VWO), a hugely popular split testing service. One of their clients was an online apparel company.
They tested their “Buy Now” button to see if it would make any difference to their sales.
Here is the original (control):
This ad looks very much like a dealership site would be designed: the call-to-action does not stick out, and it matches the surrounding color scheme so it looks nice to someone who signed off on it.
Here is variation A:
No surprise here, the green button converts better, and if we go with Hubspot, we should change this to red, as it will do even better than green.
But we should stop here and look at why green was better. Was it simply just the color? Absolutely NOT.
Take a look at the original. It has no button at all really! The CTA gets lost in the design of the t-shirt because it’s almost the exact same color – black and white on black and white. Matchy-matchy is cute for clothes, but not for your CTA buttons.
You can see the new green button clearly, regardless of whether it’s green, blue, red, yellow, or orange (or any high contrasting color).
Now you see how color tests can give you false impressions. You see some one-time crazy results and think that color is the best and always will be in every situation, but it’s not.
What the test really revealed was that there was no real button to begin with or the new button is much more prominent on the screen – it stands out from everything else and converts better because of the high-contrast color, not a specific color itself.
Here is one more test they did with another change.
Here is variation B:
The yellow button increased their conversions by another 6.3%.
Does that mean yellow is better than green? Nope, look at them closely again. The new image has green shirts, so naturally, a green button blends in and does not stick out while the yellow button does. In this instance, yellow was better, but only because of the visual hierarchy of the surroundings. It does not mean yellow will always be better just because it was in this specific instance.
Also, note that the two buttons are different. It wasn’t just the color itself that was changed, but also the inclusion of scarcity (only 24 hours) and design. How do you determine what change provided the improvement if you change two or more things at the same time?
The Color Alone Tells You Nothing – It needs context.
Look at the Hubspot example mentioned above.
Why is red the winner? Look at the entire page. The page itself has several green elements on it already, so naturally, a green button does not stick out like a red button (or any bright contrasting color) does. So yes, red wins in this instance because of its surroundings and green was a poor comparison and design.
Color alone does not really matter. It’s what the button color is surrounded with that will help determine your ultimate winner.
If your colors do not help your CTAs stand-out, then you may be seriously hurting your conversion rate by having bad colors. That could be thousands in missed sales as you leave leads on the table every single day.
With all that said, look at what your SRP/VDPs look like. I can find you hundreds upon hundreds of examples of terrible call-to-action buttons that simply blend in to match the theme, which is what we absolutely do not want.
Nissan – Dealer.com
Can you spot the CTA? The complete opposite of everything all tests prove to provide better results and more leads.
Infiniti – DealerInspire
Let’s play find the CTA!
Bing Case Study
Bing increased its revenue by $80 million with 1 simple color decision for their call-to-actions. You can read about it here.