Showerthought: I redid my website's main button from a flat blue to a gradient and the click rate went up 12% in a week.

3 comments

3 Comments

Wonder if the gradient just made it look more like a button people expect to press. Like, a flat color can sometimes look like a header label, but a gradient gives it that slight 3D, clickable feel. Were you testing it on a site with mostly flat design before? I'm curious if the contrast against the rest of the page changed, making it pop more.

kai77919d ago

Actually saw a case study from some conversion rate optimization blog a while back - they tested a gradient CTA against a flat one on a SaaS landing page. The gradient version got something like a 22% lift in clicks. Their theory was that in a world of flat UI, a gradient breaks the pattern just enough. But here's the thing - they also mentioned that if the whole page uses gradients everywhere, the effect totally disappears. So it's not really the gradient itself, it's the contrast it creates against whatever else is on the page. That's why I think context matters a ton. In my experience, a single gradient button in a sea of flat design works like a visual anchor. But if your site was already using gradients for headers or cards, it probably just blended in. Would be curious what the rest of the page looked like.

paul_sanchez1mo ago

Gradients are basically cheat codes for attention. JessicaHill is right about the 3D thing, but it's more basic than that. Our brains are trained to see shiny things as interactive. A flat color just sits there, but a gradient has visual movement. That movement makes your eye stop and tells your finger to tap. It's a tiny trick that still works way too well.

-1