Login Verification Code email template
A dark login verification email for a crypto wallet: a six digit code in a violet code box, sign-in details with device and place, and a not you link.
Light shows the email as designed. Dark and Gmail show how email apps can change its colors.
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="x-apple-disable-message-reformatting">
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>Login Verification Code</title>
<!--[if gte mso 9]><xml><o:OfficeDocumentSettings><o:AllowPNG/><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml><![endif]-->
<style>
:root{color-scheme:light dark;supported-color-schemes:light dark;}
body{margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
table,td{mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;}
img{border:0;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;}
a[x-apple-data-detectors]{color:inherit!important;text-decoration:none!important;font-size:inherit!important;font-family:inherit!important;font-weight:inherit!important;line-height:inherit!important;}
u + .ete-body a{color:inherit;text-decoration:none;}
@media only screen and (max-width:620px){
.ete-container{width:100%!important;max-width:100%!important;}
.ete-outer{padding:0!important;}
.ete-content{border-radius:0!important;}
.ete-px{padding-left:20px!important;padding-right:20px!important;}
.ete-stack{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box;padding-left:0!important;padding-right:0!important;}
.ete-stack-gap{padding-bottom:20px!important;}
.ete-fluid{width:100%!important;max-width:100%!important;height:auto!important;}
.ete-fluid-cap{width:100%!important;max-width:280px!important;height:auto!important;display:block!important;margin-left:auto!important;margin-right:auto!important;}
.ete-stack-center,.ete-stack-center p{text-align:center!important;}
.ete-h1{font-size:28px!important;line-height:34px!important;}
.ete-h2{font-size:22px!important;line-height:28px!important;}
.ete-code{font-size:24px!important;letter-spacing:2px!important;}
.ete-btn-full{display:block!important;width:100%!important;box-sizing:border-box;}
}
@media (prefers-color-scheme: dark){
.ete-body,.ete-bg{background-color:#040307!important;}
.ete-content{background-color:#0c0a14!important;}
.ete-text{color:#d6d3e6!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#9a96b0!important;}
.ete-link{color:#c4adff!important;}
.ete-border{border-color:#221e31!important;}
.ete-panel{background-color:#151225!important;border-color:#221e31!important;}
.ete-btn{background-color:#7c3aed!important;border-color:#7c3aed!important;}
.ete-btn-text{color:#ffffff!important;}
.ete-btn-outline{border-color:#7c3aed!important;}
.ete-btn-outline-text{color:#7c3aed!important;}
.ete-logo-light{display:none!important;}
.ete-logo-dark{display:block!important;max-height:none!important;overflow:visible!important;}
}
[data-ogsc] .ete-text{color:#d6d3e6!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#9a96b0!important;}
[data-ogsc] .ete-link{color:#c4adff!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#040307!important;}
[data-ogsb] .ete-content{background-color:#0c0a14!important;}
[data-ogsb] .ete-panel{background-color:#151225!important;border-color:#221e31!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#07060b;">
<!-- Made with emailtemplateexamples.com -->
<div class="ete-preheader" style="display:none;font-size:1px;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;mso-hide:all;">Your Vaultly code expires in 10 minutes. Never share it with anyone. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#07060b;">
<tr><td align="center" class="ete-outer" style="padding:24px 12px;">
<!--[if mso]><table role="presentation" width="560" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table role="presentation" class="ete-container" width="560" cellpadding="0" cellspacing="0" border="0" style="width:100%;max-width:560px;margin:0 auto;">
<tr><td class="ete-content" style="background-color:#110f1a;border-radius:12px;overflow:hidden;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;">
<tr><td align="center" class="ete-px" style="padding:28px 32px 20px;"><span class="ete-heading" style="font-family:'Courier New', Courier, monospace;font-size:24px;line-height:30px;font-weight:700;letter-spacing:-0.3px;color:#ffffff;">VAULTLY</span></td></tr>
<tr><td class="ete-px" style="padding:24px 32px 8px;"><h1 class="ete-heading ete-h1" style="margin:0;font-family:'Courier New', Courier, monospace;font-size:32px;line-height:40px;font-weight:700;color:#ffffff;text-align:center;mso-line-height-rule:exactly;">Your login code</h1></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:16px;line-height:26px;color:#d6d3e6;text-align:center;">Enter this code in the Vaultly app to finish signing in. Our team will never ask you for it.</p></td></tr>
<tr><td class="ete-px" style="padding:16px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td align="center" class="ete-panel" style="padding:24px 20px;background-color:#19162a;border:2px dashed #8b5cf6;border-radius:12px;text-align:center;"><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#9a96b0;">One time code</p><p class="ete-code ete-heading" style="margin:0;padding-top:8px;font-family:'Courier New',Courier,monospace;font-size:30px;line-height:38px;font-weight:700;letter-spacing:4px;color:#ffffff;">482913</p><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:19px;color:#9a96b0;padding-top:6px;">Expires in 10 minutes.</p></td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:16px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-panel" style="padding:24px;background-color:#19162a;border:1px solid #262236;border-radius:12px;"><h3 class="ete-heading" style="margin:0;font-family:'Courier New', Courier, monospace;font-size:19px;line-height:26px;font-weight:700;color:#ffffff;text-align:left;mso-line-height-rule:exactly;">Sign-in attempt</h3><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top:8px;"><tr><td class="ete-muted" width="90" valign="top" style="padding:8px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:22px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#9a96b0;">Date</td><td class="ete-text" valign="top" style="padding:8px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:16px;line-height:22px;color:#d6d3e6;">26 October 2026</td></tr><tr><td class="ete-muted" width="90" valign="top" style="padding:8px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:22px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#9a96b0;">Time</td><td class="ete-text" valign="top" style="padding:8px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:16px;line-height:22px;color:#d6d3e6;">8:57 AM (UTC)</td></tr><tr><td class="ete-muted" width="90" valign="top" style="padding:8px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:22px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#9a96b0;">Device</td><td class="ete-text" valign="top" style="padding:8px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:16px;line-height:22px;color:#d6d3e6;">Safari on iPhone<br><span class="ete-muted" style="color:#9a96b0;font-size:14px;">Near Toronto, Canada</span></td></tr></table></td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:24px;color:#d6d3e6;text-align:center;">Not you? <a class="ete-link" style="color:#b79dff;text-decoration:underline;" href="https://example.com/lock">Lock my wallet now</a>. Your funds stay frozen until you confirm it is you.</p></td></tr>
<tr><td align="center" class="ete-px" style="padding:28px 32px 32px;"><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:13px;line-height:21px;color:#9a96b0;line-height:20px;text-align:center;"><strong>Vaultly Labs</strong><br>50 Ledger Square, Toronto, ON M5V 2T6</p><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:13px;line-height:21px;color:#9a96b0;line-height:20px;text-align:center;padding-top:10px;">Security email for your Vaultly wallet.</p><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:13px;line-height:21px;color:#9a96b0;line-height:20px;text-align:center;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#9a96b0;text-decoration:underline;">Unsubscribe</a></p></td></tr>
</table>
</td></tr>
<tr><td align="center" class="ete-muted" style="padding:20px 12px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:18px;color:#9a96b0;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#9a96b0;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
About this template
This is our own dark design for Vaultly, a sample crypto wallet. Security emails for wallets get read in a hurry, often on a phone, so the code is the biggest thing on the page and everything else supports it.
A short heading and one line explain the code. The six digits sit in a violet dashed box with a ten minute expiry note. Below, a panel shows the sign-in attempt: date, time, device and rough location. The last paragraph is a clear not you link that locks the wallet right away.
Never put a login link and a code in the same email. Keep the subject line plain, with the code in it if your security team allows. Send it instantly and expire the code quickly.
Use it in your email tool
- Click Copy HTML, or download the .html file.
- In Mailchimp, Brevo, HubSpot or Klaviyo, start a new email with the custom HTML or code editor and paste it in.
- Change the text, links and images. Map merge tags such as {{first_name}} and {{unsubscribe_url}} to the tags of your tool.
- Send a test to yourself on desktop and phone before you send it to your list.
Sections in this email
- Wordmark
- Heading and message
- Six digit code box
- Sign-in details panel
- Not you link
- Footer
Subject line ideas
- Your Vaultly login code: 482913
- Vaultly sign-in code
- Confirm it is you, {{first_name}}
Preview text idea
Your Vaultly code expires in 10 minutes. Never share it with anyone.