Marketing blocks
Newsletter CTA sections
Newsletter sign-up sections built from the Input and Button atoms: inline, centered, phone mockup and card. Figma: Newsletter CTA section.
import
{ NewsletterSection, type NewsletterLayout } from "@pepulux/ui"Inline
Sign up for our newsletter
Product updates, articles and resources — once a month.
Centered (muted)
Join 10,000+ subscribers
Get the best of Pepulux in your inbox.
Mockup
Be the first to know when we launch
Get early access and exclusive updates.
9:41
Card (brand)
Don't miss an update
We send one thoughtful email a month.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| layout | "inline" | "centered" | "mockup" | "card" | "inline" | Figma layout |
| tone | "light" | "muted" | "brand" | "light" | Background tone — Figma Light / Muted / Brand |
| title / description | ReactNode | — | Heading content |
| placeholder / submitLabel / note | string / string / ReactNode | — | Form copy |
| onSubmit | (email: string) => void | — | Called with the entered address |
| image | string | — | Phone screenshot for the mockup layout |