November 16, 2015 | Kayla Hollatz
CTA Color Importance
Your call-to-action (CTA) button is the most important thing on your landing page. No matter how great your landing page design and copy is, you won’t meet your campaign goals if your button doesn’t beg to be clicked.
We talked about the importance of CTA button copy in our post Death to the Submit Button, but today we’re getting down to the nitty-gritty of how to use color and contrast to increase your conversion rates.
Which color will net me more leads?
Sadly, it’s not that simple. When choosing a color for your calls-to-action, you can’t worry about what the Joneses are doing or what’s worked somewhere else.
Take a look at this example from Hubspot on ConversionXL’s blog:
The red CTA button raised conversions by 21%.
So red is better than green, right?
Not exactly. This is when it gets tricky.
When you take a deeper look into the example, you’ll notice something else that could’ve caused an increase in conversions for the red button: the use of green throughout the landing page. See, red is directly opposite green on the color wheel — meaning they’re two colors in big contrast to each other.
The green branding of Performable made the red button stand out because of the contrast. The green button didn’t have a chance.
So we’re not here to convince you that a red call to action button is better than a green one or vice versa. No single color can be deemed as the best for conversion because its effectiveness depends on:
- The contrast of the button to the background of the page
- The contrast of the button to the signature branding colors of the brand
- The emotional reaction it evokes from visitors
Knowing your audience, and what moves them to take action, can be very helpful in determining color schemes on your website and landing pages.
Why should we care about contrast?
The more attention the CTA button gets, the better the likelihood of a visitor clicking it. The higher the contrast between elements on the page and the CTA, the more attention is directed toward the button.
Okay, so you know what good contrast looks like in the first example, but what about bad contrast?
Did you look at this and have a face-palm moment? Me too.
That (dark) blue button is having a hard time standing out against the (lighter) blue form background.
If that button was a BOB, or big orange button as Unbounce likes to call it, Salesforce would convert more leads. Why? Because of the high contrast orange would create in contrast to the blue.
Don’t make your visitors search for your CTA!
That being said, a low-contrast CTA button is definitely better than a ghost button…
…which leaves visitors with zero contrast.
It’s like Peep Laja and Oli Gardner say in their Landing Page Design course:
“Button color is irrelevant. Button contrast is what matters.”
In this example from Instapage, it’s not the color of the button that matters. It’s the contrast.
All this talk about calls-to-action and contrast — but I’m sure marketers just want to know: “What’s the best conversion color?!”
The answer?
And the Best CTA Button Color is…(drumroll)
…It depends.
Again, we can’t stress enough that it’s all about the contrast.
In fact, contrasting — or complementary — coloring is so important in conversions that Angie Schottmuller gave an entire presentation about how color influences conversions at the Unbounce Conversion Road Trip in June. Her data revolves around a cool bit of biology:
If our eyes are inundated with a specific color, they’re built to seek out the complementary color.
That means your web visitors are just begging you to show them some contrast! Don’t let them down.
As with any other aspect of marketing, remember to always test your call-to-action buttons before believing one color is better than another for you. There’s always room to test.
Google once tested 50 shades of blue (not grey) for their CTA color to see which converted the best. FIFTY!
If it matters to Google and your visitors, it should matter to you. A lot.
Because, quite simply: call-to-action contrast = higher conversions.
Boom. *mic drop*
Happy testing!
Have you tested a landing page to see if your conversion rates were increased by a change in color or contrast? If so, what were your results?
Let us know in the comment section below.