auth pattern

Verify email sent

Confirmation screen after sign-up — user is told to check inbox.

When to use it

Right after sign-up when emailVerification is required.

  • Reassure the email is on its way
  • Resend escape hatch

Layout regions

  • header
  • card

States

  • default
  • loading
  • success

Example

<Card><CardHeader><CardTitle>Check your email</CardTitle><CardDescription>We sent a link to {masked(email)}.</CardDescription></CardHeader><CardContent><Button onClick={resend} disabled={cooldown > 0}>{cooldown > 0 ? `Resend in ${cooldown}s` : 'Resend email'}</Button></CardContent></Card>

The full Verify email sent pattern specifies 4 exact microcopy strings, 1 motion spec, 4 composition rules — all gated behind the full recipe. Get the full recipe.

Build the Verify email sent pattern in your project.