Skip to content
Launch offerSolo $19 $49 · Team $39 $79Launch pricing ends Sunday
Mailblocks
LibraryGet it →

Verify email email

Confirm-your-address email with a button, a fallback link and the expiry window spelled out.

Free — get the code ↓
11.4 KB · Gmail-safe

Code

import * as React from "react";
import { Btn, Divider, Eyebrow, Fallback, H1, P, Shell, Small, type TemplateProps } from "../components";

export type VerifyEmailProps = TemplateProps & {
  email?: string;
  verifyUrl?: string;
  expiresInHours?: number;
};

export default function VerifyEmail({
  style,
  brand,
  email = "maya@northbeam.co",
  verifyUrl = "https://fieldnote.app/verify?token=8f3a1c9e2b7d",
  expiresInHours = 24,
}: VerifyEmailProps) {
  return (
    <Shell style={style} brand={brand} label="Account" preview={`Confirm ${email} to finish setting up your account.`}>
      <Eyebrow>One quick step</Eyebrow>
      <H1>Confirm your email address</H1>
      <P>
        Tap the button below to confirm <strong>{email}</strong> belongs to you. This keeps your account secure and
        makes sure you get receipts and security alerts.
      </P>
      <Btn href={verifyUrl}>Confirm email address</Btn>
      <Small>This link expires in {expiresInHours} hours and can only be used once.</Small>
      <Divider my={24} />
      <Fallback href={verifyUrl} />
      <Small mb={0}>Didn't create an account? You can safely ignore this email — nothing will happen.</Small>
    </Shell>
  );
}

VerifyEmail.PreviewProps = { email: "maya@northbeam.co" } satisfies VerifyEmailProps;

The TSX imports components.tsx and theme.ts from the kit. Grab the free starter (all six free templates with their components) on the free page.

Related

← WelcomeGetting started →
Welcome email template previewFree

Welcome

№01 · Onboarding

A founder-signed welcome with one primary action and a three-step activation checklist.

Getting started email template preview

Getting started

№03 · Onboarding

Activation checklist that ticks off completed steps and shows progress at a glance.

Finish setup nudge email template preview

Finish setup nudge

№04 · Onboarding

Short nudge for users who stalled on a single setup step, with a progress meter.

Trial ending email template preview

Trial ending

№05 · Onboarding

Trial reminder that recaps what the user built and makes the plan choice obvious.