CTA Banner

single-focus x band

A single-focus closing band — headline, one line of support copy, and a primary action.

ctabannerconversion

Build something people love.

One command and you're live.

Get started →

Code

cta-banner.tsx

export function CtaBanner() {
  return (
    <section className="mx-auto max-w-5xl px-6 py-24">
      <div className="flex flex-col items-center gap-4 rounded-3xl border border-border bg-card p-16 text-center">
        <h2 className="text-3xl font-semibold tracking-tight">Build something people love.</h2>
        <p className="text-muted-foreground">One command and you're live.</p>
        <a className="rounded-full bg-foreground px-6 py-3 text-background">Get started →</a>
      </div>
    </section>
  );
}

Use it in another build

Drop this section into a page, keep your project tokens, and it themes itself. Or tell Claude Code: “add the CTA Banner section and fill it with my copy.”