Skip to content

Answer · Conversion Engineering

What Color Should My CTA Be?

14 days kickoff → live $3K–$15K+ scope-tiered WCAG 2.1 AA baseline

The short answer

There’s no universally-best CTA color. The right answer: the most-distinct color from everything else in the CTA’s visual neighborhood. On a white page, saturated colors (orange, lime, deep blue) win. On a dark page, light or accent colors. The bigger lever is CTA copy — test that first.

№ 01The longer answer

The “red converts best” advice is wrong. Studies cited for that claim used red because it contrasted with the test pages’ existing colors — not because red is inherently magical. The actual mechanism is contrast, not specific color.

Rule of thumb: the CTA should be the highest-contrast element within its container. If the rest of the page uses blues and grays, an orange CTA pops. If the page is already orange-heavy, a contrasting blue or green pops more. Match the rule to the page, not to a generic best-practice.

Accessibility constraint: WCAG 2.1 AA requires 4.5:1 contrast between button text and button background. Many brand-color CTAs fail this (light buttons with white text). Check contrast with a tool like WebAIM’s Contrast Checker before shipping. Non-compliant CTAs lose business AND fail accessibility QA.

The honest hierarchy of CTA decisions: copy > position > size > color. If you have one CRO test to run, test copy first. Color tests are last because the expected lift is smallest (typically 1-3% if it’s significant at all).

№ 02Should I A/B test button colors?

Probably not, unless you have 100K+ monthly sessions. The expected lift from color is small (1-3%) and requires huge sample sizes to detect with confidence. Test copy or position first — bigger lifts, smaller required samples.

№ 03Does brand color matter?

Yes, for brand consistency — but it’s a constraint, not a CRO lever. Pick a brand-aligned CTA color that contrasts well with surrounding content, then move on. Don’t fight the brand to chase a 2% color lift.

№ 04What about button shadows or animations?

Subtle micro-interactions (hover state, slight scale on hover) can lift CTA click rates 1-3%. Heavy animations or pulsing CTAs are gimmicky and read as desperate. Stick with restrained interaction patterns.