# Shadcn CTA blocks

> Call to action sections that close a page, from centered email captures and split layouts to full-width banners with photos and proof rows.

- Type: Pro blocks (Marketing)
- Page: https://web.dev.reui.io/blocks/marketing/cta
- Blocks: 17
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## When to use

- A closing get started band with a headline and 1 or 2 actions, some backed by logos, avatars or a rating
- Email capture for a newsletter, a waitlist or release updates, with an inline email field and submit button
- A sales prompt that books a call or opens a contact route rather than a self-serve signup

## When not to use

- The first screen of a page, with the main headline and a product console above the fold: use the [Hero blocks](https://web.dev.reui.io/blocks/marketing/hero.md)
- A compact promo tile with 1 button, sized to sit beside other cards in an app page: use the [Card blocks](https://web.dev.reui.io/blocks/application/card.md)
- A sign in or sign up page with a password, a magic link or social provider buttons: use the [Auth blocks](https://web.dev.reui.io/blocks/application/auth.md)

## Agent notes

- The headline and every action label are written inline in `Cta` in components/cta.tsx, never in a data file; rewrite them there
- No action is wired: every `href` is a placeholder hash and no email form reaches a backend; connect real routes and a submit handler

## Third-party libraries

- Motion v12: [API reference](https://motion.dev/docs/react-motion-component), [docs](https://motion.dev/docs/react), used by 2 of 17 blocks (the docs follow the latest Motion, with no React API break since v12)

## Blocks

- [Newsletter CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-1.md): Centered newsletter signup CTA with mail-prefixed email input and avatar-stack subscriber proof. Best for a Sunday newsletter signup with a mail icon email field and 5 overlapping subscriber portraits beside a joined count.
- [Feature Strip CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-2.md): Split CTA card with image media panel, badge eyebrow, dual link buttons, and feature trust strip. Best for a 2 column card with the pitch and a dot separated feature strip beside an abstract image on a dot grid, hidden on mobile.
- [Work Email CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-3.md): Centered Frame CTA with animated grid background, badge eyebrow, and single email capture form. Best for a work email request inside a Frame panel over a skewed grid whose squares fade in and out, with a reassurance line under the form.
- [Proof Grid CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-4.md): Centered marketing CTA with badge eyebrow, framed three-column proof grid, and dual link buttons. Best for a 3 panel Frame of icon proof points set between the centered pitch and a large primary and outline button pair.
- [Headline Only CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-5.md): Full-width aurora-gradient CTA banner with a two-line headline and one rounded-full pill button. Best for a headline only band on a static blue aurora gradient, with 1 pill button and no lede, eyebrow or proof.
- [Final Conversion CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-6.md): Dark violet CTA banner with animated neon sine-wave line-stream backdrop and one rounded-full button. Best for a dark violet band where looping neon sine lines scroll behind a 2 line headline, a lede and 1 pill button.
- [Agency Booking CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-7.md): Animated analytics dashboard mockup on a gradient mesh beside CTA copy and a scrolling logo marquee. Best for an agency booking pitch beside a scaled analytics console mockup with an order table, and a wordmark marquee under the copy.
- [Footer Docs CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-8.md): Night Earth CTA banner with WebGL city lights turning on the globe beside light and outline buttons. Best for a solid dark banner whose turning WebGL night Earth bleeds off the right edge and drops under the copy when narrow.
- [Space Launch CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-9.md): Frosted glass CTA panel over a star field with an orange sun and a turning night Earth. Best for a translucent glass card that hazes the star field, orange sun and turning Earth behind it while they stay crisp around it.
- [Tool Handoff CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-10.md): Figma and Cursor brand-button CTA centered under a pill eyebrow badge and a 9-avatar builder stack. Best for tool handoff actions to preview in Figma or start in Cursor, under a roster of 9 builder portraits.
- [Customer Logos CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-11.md): Masked tower photo cutout bleeding off an emerald CTA banner with a looping wordmark marquee. Best for an emerald banner with an architectural photo cut out along the tower outline and a wordmark marquee that pauses on hover.
- [Proof Points CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-12.md): Rotating Mars CTA banner on dotted indigo with paired buttons and 3 pulsing proof checks. Best for an indigo banner where a WebGL Mars turns under a fixed sun, with 3 check proof points whose rings pulse in turn.
- [MCP Integrations CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-13.md): MCP integrations CTA banner with 11 floating extruded logo tiles on an isometric grid floor. Best for an integrations banner whose 11 brand tiles spring onto an isometric grid floor and float, beside a static row of 4 trust logos.
- [Release Updates Signup](https://web.dev.reui.io/blocks/marketing/cta/cta-14.md): Dark newsletter signup banner with inline email join form and a rotating WebGL night Earth. Best for a dark newsletter banner whose one email field and Join button give way to a polite live confirmation on submit.
- [Outcome Checklist CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-15.md): Outcome checklist CTA banner on emerald with 4 checked items, an amber action and lime corner glows. Best for a benefits recap pairing the pitch and an amber action with a column of 4 checked outcomes beside it.
- [Sales Contact CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-16.md): Sales contact CTA banner with the headline left and Contact Us and Book a Call buttons right. Best for a dark banner with no illustration, split into copy and a 320px right side action well, with message and calendar icons on 2 buttons.
- [Review Rating CTA](https://web.dev.reui.io/blocks/marketing/cta/cta-17.md): Star rating review pill CTA on a dark dot-grain banner with a centered brand logo tile. Best for a centered dark banner topped by a brand mark tile and closed by a linked star rating pill with a review count.

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.
