Sign in without a password. The first screen tells people to check their inbox and offers a resend timer. The second confirms the email.

What is included

• An inbox icon with soft rings
• Open email app and resend buttons
• A countdown on the resend button
• A success check with confetti dots
• A summary card and continue button

Where to use it

Use it for passwordless login or to confirm an email address.

Design notes

This magic link and email verification screens follows a simple rule: Account screens work best when every step is short and clear. Keep one main action per screen, show errors next to the field, and keep the same spacing across the whole flow. It includes an inbox icon with soft rings, open email app and resend buttons, a countdown on the resend button, so you can start from a finished layout and change only what you need.

Built for editing

Spacing follows a 4 point scale and layers have clear names, so developers can find what they need. Fonts are free on Google Fonts, and every color can be changed from the fill panel. You also get a success check with confetti dots and a summary card and continue button.

How to use it

Copy the component with the copy button and paste it into Figma with Ctrl+V or Cmd+V. The layers keep their auto layout, so you can edit text, colors and spacing. The text uses Plus Jakarta Sans and a few free Google Fonts. Install them first so the text looks the same.

Light version

This listing is the light version. The dark version is listed separately.