CTA

Call-to-action section patterns.

Basic CTA

<section class="py-24">
  <div class="container">
    <div class="rounded-2xl bg-primary p-12 text-center text-primary-foreground">
      <h2 class="text-3xl font-bold">Ready to get started?</h2>
      <p class="mt-4 text-primary-foreground/80 max-w-xl mx-auto">
        Join thousands of teams already using our product.
        Start your free trial today.
      </p>
      <div class="mt-8">
        <a href="#" class="inline-flex items-center px-6 py-3 rounded-lg bg-background text-foreground font-medium hover:bg-background/90">
          Start Free Trial
        </a>
      </div>
    </div>
  </div>
</section>

Patterns

With Form

Inline email capture or signup form.

Split

Text on left, form or buttons on right.

Minimal

Simple text with single button.

Best Practices

Action-oriented - "Start", "Get", "Try", not "Submit"
Reduce friction - Minimize form fields
Create urgency - Limited time, exclusive access
Reinforce value - Remind what they'll get
Stand out - Contrasting background color