20% offProwith

Buy now

Marketing section

Call to action

shadcn addcta
detentui.com

Wire it up

All optional. With none, it plays exactly as it does here and hands over to whoever touches it.

Usage
<CTA
  tickets={tickets}
  product={product}
  title={title}
  onSubmit={(email) => {}}
/>

Your data

tickets

The tickets in the queue: who, what they asked, and how it ended.

{ from, hue, text, outcome, handed? }[]
Default—
product

The product’s name, on its line through the queue and in the sentence under the heading.

string
Default'Detent'
title

The heading, set in two tones.

[string, string]
Default—
subline

One sentence under the heading.

string
Default—
action

The button’s words.

string
Default'Start free'
placeholder

Shown in the field while it’s empty.

string
Default'you@company.com'
note

The small line under the field.

string
Default—

What it tells you

onSubmit

Called with the email a person starts with. Return a promise to keep the button busy until it settles.

(email: string) => Promise<void> | void
Default—

Every block also takes accent, the one colour everything in it derives from; autoplay, which plays the demo until someone touches it; and className.