All posts
Guide
April 12, 2026·5 min read

Write CTAs That Convert: A Practical, Tested Playbook

From verbs to visual weight, turn dead buttons into decisive actions.

Most landing pages underperform because the call to action is vague, timid, or visually lost. The CTA is not a button; it’s a contract—your promise plus the next safe step. Done right, it increases conversion without more traffic. Done wrong, it leaks intent you already earned with your headline and proof.

The Job of a CTA: Promise + Next Step

Every CTA should connect the page’s core promise to the minimal next commitment. Map it like this: “Outcome → Immediate step → Safety.” If your hero promise is “Accept payments,” then “Start accepting payments” paired with “No credit card” matches the mental model. Stripe does this well. If your promise is “Deploy in seconds,” then “Deploy to Vercel” is more magnetic than “Get started,” because it names the outcome.

Notion’s best CTAs align to use cases: “Try Notion free” after a productivity promise; “Download for Mac” on the download page. Linear focuses on momentum: “Get started” on hero, “Create workspace” inside. Superhuman converts a premium pitch by promising a concierge next step: “Request access” with microcopy about a 30‑minute setup.

The enemy of a good CTA is ambiguity. “Learn more” is usually a sign that you don’t know what you want the user to do. If the next step truly is educational (docs, tour), say it plainly: “See pricing,” “Watch 2‑min demo,” or “Read docs.”

Copy Patterns That Pull, Not Push

Great CTA copy is short, specific, and friction‑aware. Use one of these patterns and tune to your product:

  • Verb + Outcome: “Design together,” “Deploy now,” “Track issues.”
  • Verb + Object + Time: “Start billing in minutes,” “Invite your team now.”
  • Outcome + Safety: “Start free—no card,” “Request access—no waitlist.”
  • Role + Outcome: “For developers: run on Vercel,” “For design leads: plan sprints.”
  • Command + Specific Noun: “Create workspace,” “Install extension,” “Import data.”
  • Social proof + Action: “Join 10,000 teams—start free.”
  • Secondary path clarity: “Talk to sales,” “See enterprise features.”

Match tone to audience. Developers prefer literal, low‑hype verbs (Stripe, Vercel). Design and PM tools can lean slightly aspirational if the outcome is still concrete (Figma, Notion, Linear). Premium B2B like Superhuman earns a concierge tone because service is part of the product.

Microcopy matters. Add a single line beneath or inside the button to resolve the biggest fear:

  • “No credit card required”
  • “Takes 2 minutes”
  • “Free for 14 days”
  • “SAML SSO available”

Keep microcopy to one benefit; stacking three lines makes the CTA feel heavy.

Visual Hierarchy That Makes the Button the Star

Your CTA should be the most visually prominent actionable element above the fold. That means contrast, size, whitespace, and motion work in its favor.

  • Contrast: Use a brand color that stands out against the hero background. If your page is blue, a blue button disappears. Stripe varies shades; Figma uses a high‑contrast fill.
  • Size: Big enough to be the obvious click target, small enough to feel decisive, not shouty.
  • Whitespace: Generous padding around the CTA isolates it from nav and secondary links.
  • Focus state: Keyboard users should see a strong focus ring (Linear nails this).
  • Motion: A subtle hover or a 1‑second micro‑gif showing the next state (e.g., Vercel deploy spinner) can increase intent.

Avoid ghost buttons for primaries. If everything is outlined, nothing is primary. Place the primary CTA to the right of the secondary on desktop, stacked with primary on top for mobile. Ensure the primary CTA is visible without scrolling on small devices; test on an iPhone SE size viewport.

Reduce Perceived Risk and Commitments

People hesitate because they fear time waste, billing traps, data loss, or social risk (looking foolish). Your CTA can pre‑answer one of these.

  • Time: “2‑minute setup,” “Import your Notion data,” “Auto‑detect framework.”
  • Money: “Free plan available,” “No card needed.”
  • Data: “Keep your GitHub—no repo access required.”
  • Social: “Private by default,” “Draft mode only.”

Superhuman’s concierge onboarding turns a premium CTA into a relief: “Request access” backed by “We help you set up shortcuts in 30 minutes.” Vercel reduces fear with framework auto‑detect and instant rollbacks—mention one near the deploy button. Stripe reduces billing fear with transparent fees and a link to docs right next to “Start now.”

Use progressive disclosure: primary CTA for the main path, tiny text link for skeptics (“Watch 2‑min demo”). You convert the ready while giving the cautious a no‑risk path.

CTA Variants Across the Journey

Different pages, different jobs. Tune copy and friction accordingly.

  • Home hero: broad promise, lowest friction (“Start free,” “Deploy now”).
  • Pricing: plan‑specific intent (“Start Pro trial,” “Contact sales”).
  • Docs: developer action (“Run in your project,” “Copy snippet”). Stripe excels here with “Install via npm.”
  • Product tours: outcome sampler (“Watch 2‑min tour”).
  • Import flows: concrete noun (“Import from Jira,” “Migrate from Trello”). Linear’s import CTA names the source, which boosts confidence.
  • Upgrades: value‑tied action (“Unlock SSO,” “Add editors”). Figma converts upgrades by naming the capability you gain.

On mobile, use sticky footers with the primary CTA once the promise is clear. Keep it one line and avoid blocking content. If your primary action requires input (email), test “Continue” vs “Create account” vs “Next”—“Continue” often feels lighter.

Measurement and Iteration

Measure CTA success beyond clicks. Track activation, not just tap‑through. A high‑CTR button that leads to abandonment is mis‑sold.

  • Define one macro conversion for each CTA (trial start, deploy, install).
  • Track first‑run success (time to first value) connected to the clicked CTA.
  • Run A/Bs for copy (“Deploy” vs “Get started”), microcopy (“No card”), and placement.
  • Segment by device, referrer, and persona. Developers coming from docs need different CTAs than execs from a blog.

Evaluate sample sizes honestly. For a medium‑traffic SaaS, run tests for at least one activation cycle (often 1–2 weeks) and stop chasing p‑value haircuts. Consistent directional wins on activation beat transient CTR spikes.

Your CTA Playbook for This Week

  • Rewrite hero CTAs to name the outcome (“Deploy to Vercel,” “Start accepting payments”).
  • Add one fear‑reducing microcopy line. Remove the rest.
  • Promote the primary CTA’s visual weight; demote secondary paths.
  • Align pricing CTAs to plan intent; add a sandbox link for enterprise.
  • Add a concrete import CTA where migration is a blocker (Linear‑style naming).
  • On docs pages, use code‑first CTAs (“npm i @yourpkg”).
  • Test “Start free” vs “Start 14‑day trial” vs “Request access” based on your motion.

Buttons don’t convert. Clear promises, safe next steps, and decisive visuals do. Treat CTAs like contracts, and you’ll stop leaking intent you already earned.