Verify Email Envelope email template
A clean confirm-your-email message with a spaced wordmark, a large envelope icon, one rounded teal button and a three column footer with links.
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>Verify Email Envelope</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;}
.ete-ds-30{font-size:28px!important;line-height:31px!important;}
.ete-cell{padding-left:0!important;padding-right:0!important;}
}
@media (prefers-color-scheme: dark){
.ete-body,.ete-bg{background-color:#101213!important;}
.ete-content{background-color:#181b1c!important;}
.ete-text{color:#c4c8cb!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#9aa0a4!important;}
.ete-link{color:#5fd8c9!important;}
.ete-border{border-color:#2c3133!important;}
.ete-panel{background-color:#202425!important;border-color:#2c3133!important;}
.ete-btn{background-color:#2fc4b2!important;border-color:#2fc4b2!important;}
.ete-btn-text{color:#08201d!important;}
.ete-btn-outline{border-color:#2fc4b2!important;}
.ete-btn-outline-text{color:#2fc4b2!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:#c4c8cb!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#9aa0a4!important;}
[data-ogsc] .ete-link{color:#5fd8c9!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#101213!important;}
[data-ogsb] .ete-content{background-color:#181b1c!important;}
[data-ogsb] .ete-panel{background-color:#202425!important;border-color:#2c3133!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#f1f1f1;">
<!-- 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;">Tap the button inside to confirm your address and finish signing up. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#f1f1f1;">
<tr><td align="center" class="ete-outer" style="padding:24px 12px;">
<!--[if mso]><table role="presentation" width="600" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table role="presentation" class="ete-container" width="600" cellpadding="0" cellspacing="0" border="0" style="width:100%;max-width:600px;margin:0 auto;">
<tr><td class="ete-content" style="background-color:#ffffff;">
<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;"><a href="https://example.com/" style="text-decoration:none;color:#111111;"><span class="ete-heading" style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:20px;line-height:25px;font-weight:700;letter-spacing:3px;color:#111111;">INKPOST</span></a></td></tr>
<tr><td height="24" style="height:24px;font-size:0;line-height:0;mso-line-height-rule:exactly;"> </td></tr>
<tr><td align="center" class="ete-px" style="padding:12px 32px;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/icon-mail-bfc5c9.png" alt="Line drawing of an envelope" width="96" height="96" class="" style="display:block;width:96px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;margin:0 auto;"></td></tr>
<tr><td class="ete-px" style="padding:24px 32px 8px;"><h1 class="ete-heading ete-ds-30" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:30px;line-height:36px;font-weight:700;color:#111111;text-align:center;mso-line-height-rule:exactly;">Please verify your email</h1></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:24px;color:#7a7f84;text-align:center;">One click and your Inkpost account is ready. We only send the notes you asked for.</p></td></tr>
<tr><td align="center" class="ete-px" style="padding:16px 32px;"><table role="presentation" cellpadding="0" cellspacing="0" border="0" align="center"><tr><td align="center"><!--[if mso]><v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://example.com/confirm" style="height:48px;v-text-anchor:middle;width:253px;" arcsize="50%" strokecolor="#0c8276" fillcolor="#0c8276"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Yes, confirm my email</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/confirm" style="display:inline-block;background-color:#0c8276;border:1px solid #0c8276;line-height:48px;border-radius:24px;color:#ffffff;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:700;text-align:center;text-decoration:none;padding:0 28px;-webkit-text-size-adjust:none;mso-hide:all;"><span class="ete-btn-text" style="color:#ffffff;">Yes, confirm my email</span></a><!--<![endif]--></td></tr></table></td></tr>
<tr><td height="24" style="height:24px;font-size:0;line-height:0;mso-line-height-rule:exactly;"> </td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-border" style="border-top:1px solid #e6e6e6;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:16px 20px 0;"><div style="font-size:0;text-align:left;"><!--[if mso]><table role="presentation" width="560" cellpadding="0" cellspacing="0" border="0"><tr><td width="186" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:33.33%;max-width:100%;width:33.33%;width:calc((448px - 100%) * 448);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:12px 12px 8px;"><p class="ete-heading" style="margin:0 0 8px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#111111;">About</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#7a7f84;line-height:20px;">Inkpost is a small writing and newsletter tool made by a team of four in Portland.</p></td></tr></table></div><!--[if mso]></td><td width="186" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:33.33%;max-width:100%;width:33.33%;width:calc((448px - 100%) * 448);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:12px 12px 8px;"><p class="ete-heading" style="margin:0 0 8px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#111111;">Contact</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#7a7f84;line-height:20px;">212 Alder Street<br>
Portland, OR 97204<br>
hello@example.com</p></td></tr></table></div><!--[if mso]></td><td width="186" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:33.33%;max-width:100%;width:33.33%;width:calc((448px - 100%) * 448);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:12px 12px 8px;"><p class="ete-heading" style="margin:0 0 8px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#111111;">Useful links</p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/" style="color:#7a7f84;text-decoration:underline;">Home</a></p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/about" style="color:#7a7f84;text-decoration:underline;">About</a></p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/help" style="color:#7a7f84;text-decoration:underline;">Help</a></p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/privacy" style="color:#7a7f84;text-decoration:underline;">Privacy</a></p></td></tr></table></div><!--[if mso]></td></tr></table><![endif]--></div></td></tr>
<tr><td align="center" class="ete-px" style="padding:28px 32px 32px;"><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#7a7f84;line-height:20px;text-align:center;padding-top:10px;">You get this email because someone signed up for Inkpost with this address.</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#7a7f84;line-height:20px;text-align:center;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#7a7f84;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:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:18px;color:#7a7f84;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#7a7f84;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
Adapted from Colorlib Email Templates (template 10, e-Verify) by Colorlib, MIT license.
About this template
A sign-up confirmation for a newsletter tool, a writing app or any service that needs people to prove the address is theirs before the first real email goes out. It is short on purpose: the reader should see the button within a second.
A spaced, all caps wordmark sits at the top. Under it a large line drawing of an envelope sets the topic without any words, then a bold headline asks the reader to confirm, and one plain sentence says what happens next. A rounded teal button carries the only action.
A thin line separates the message from a three column footer: a short note about the company, a postal address, and four useful links. A small unsubscribe line closes the email.
The layout comes from a designer template built for account verification. Swap the wordmark and the teal for your own brand color and change the one sentence under the headline. Keep the rest as it is, so the confirm button stays the first thing people notice.
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
- Spaced wordmark
- Envelope icon
- Headline and one line
- Confirm button
- Three column footer
- Unsubscribe line
Subject line ideas
- Please confirm your email
- One click to finish signing up
- {{first_name}}, confirm your Inkpost address
Preview text idea
Tap the button inside to confirm your address and finish signing up.