Call to Action Button Design: Colour, Copy and Placement

A call to action (CTA) button tells visitors what to do next: buy, book, download or call. Good call to action button design makes the next step obvious, easy to tap and worth taking.

Write clear button copy

Use verbs and tell people what happens.

• Better: "Get my free quote", "Book a demo", "Download the checklist"
• Weaker: "Submit", "Click here", "Go"

Keep it to two to five words. Match the promise to the page. If the button says "Free guide", the next screen should deliver a free guide. For more ideas, see UX writing and microcopy.

Choose colour with contrast

• Pick a colour that stands out from the background and the rest of the page.
• Use one primary button colour consistently, so people learn what is clickable.
• Check text contrast against the button background. Our accessible web design basics guide explains the contrast rules.
• There is no magic "best" colour. Contrast and consistency matter more than the hue itself. For background reading, see colour psychology in marketing.

Size and shape

• Make buttons large enough for a thumb on mobile.
• Leave breathing space around them so they do not blend into text.
• Use padding and a clear shape, with a visible hover and focus state.

Placement

1. Put a primary CTA in the hero section, near the top.
2. Repeat it after key content blocks, such as benefits or testimonials.
3. Add one at the end of the page, so nobody has to scroll back up.
4. On mobile, consider a sticky bottom button for call or WhatsApp if it suits the business.

One primary action per section

Too many options cause hesitation. Keep a single main button and, if needed, a quieter secondary link, such as "See pricing".

Add reassurance nearby

A short line beside the button can reduce doubt: "No credit card needed", "Reply within one working day" or "Cancel anytime". Only use claims that are true for your business.

Hypothetical example

A Mumbai accountant changes a grey "Submit" button to a contrasting "Get my free tax checklist" button, and adds a line saying the checklist arrives by email. The page now clearly explains what the click does.

Test it

Change one thing at a time, such as the wording or the position, and compare results. The method is explained in landing page A/B testing.