kevingirelli

Newsletter

CTAs 4

About

An inline newsletter sign-up band with a title/description on one side and an email form with pending, success and error states on the other.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Newsletter to your project and fits it to your theme.

Code

How Newsletter is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { Newsletter } from "@/components/ui/newsletter";

export default function NewsletterDemo() {
  return (
    <Newsletter
      onSubscribe={async (email) => {
        await new Promise((resolve) => setTimeout(resolve, 1000));
        console.log("subscribed", email);
      }}
    />
  );
}

More by kevingirelli

View all
  • Aurora

    Aurora

    54
  • QR Code

    QR Code

    49
  • Warp Gradient

    Warp Gradient

    48
  • FAQ Section

    FAQ Section

    46
  • Corner Frame

    Corner Frame

    37
  • Wave Text

    Wave Text

    37
  • Animated Border

    Animated Border

    32
  • Spotlight

    Spotlight

    23

More in CTAs

View all
  • Call to Action 01

    Call to Action 01

    48
  • CTA 3

    CTA 3

    403
  • Call To Action

    Call To Action

    39
  • Responsive Hero Banner

    Responsive Hero Banner

    2K
  • Call to Action

    Call to Action

    22
  • Single Plan Pricing Card

    Single Plan Pricing Card

    17
  • Hero

    Hero

    1.2K
  • Call to action

    Call to action

    172