Cta Band

A closing CTA section with a large lit headline and an inline email form whose button animates from idle to sending to a success check. Async onSubmit.

src/registry/blocks/cta-band.tsx/r/cta-band.json

Installation#

bash
npx shadcn@latest add https://ui.minidev.pro/r/cta-band.json

Usage#

tsx
import { CtaBand } from "@/components/ui/cta-band"

export function Example() {
  return <CtaBand />
}

API reference#

CtaBand props
PropTypeDefault
titleReact.ReactNode( <> Know what changed <br /> <span c...
descriptionReact.ReactNode"Connect a source and get your first ...
placeholderstring"you@company.com"
buttonstring"Start free"
successstring"Check your inbox"
onSubmit(email: string) => void | Promise<void>-
noteReact.ReactNode"No card. Cancel in one click."
classNamestring-

Dependencies#

npm

lucide-reactmotion

Built from

No other MiniDev files
All Landing page sections for React and Tailwind