Email Addresses Card
Ruled rows for each account email with primary and verification badges, resend and remove actions, and an inline add address form below.
Ruled rows for each account email with primary and verification badges, resend and remove actions, and an inline add address form below.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Email Addresses Card lists every address linked to an account in a ruled panel: a verified primary (avery@acme.com), a verified backup used only for recovery, and a pending work address with the verification window stated. Each row carries its routing line, a Primary or Pending badge, and the actions that fit its state: Resend link, Make primary, Remove. An inline add address form sits below with a labeled input and a verification note.
Addresses are a typed const array; the primary and status flags govern which badges and buttons appear. The pending row is deliberate, it shows users exactly what an unverified address looks like and how to finish it.
Reach for this block on the account or profile settings page, wired to your email API. Keep the primary address non-removable server-side (the block omits its Remove button) and hold each new address in pending until the verification link is opened.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the personal account email manager. Other address surfaces:
Tip: keep the primary address as the one place security alerts land, and say so on the row so users do not expect them anywhere else.