Double Opt-In Confirmation email template
A double opt-in email for a grocer newsletter: a basket of produce illustration, one confirm button and a short list of what subscribers will get.
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>Double Opt-In Confirmation</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-cell{padding-left:0!important;padding-right:0!important;}
}
@media (prefers-color-scheme: dark){
.ete-body,.ete-bg{background-color:#0f110b!important;}
.ete-content{background-color:#181b13!important;}
.ete-text{color:#dde3d0!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#a3aa94!important;}
.ete-link{color:#b5dd98!important;}
.ete-border{border-color:#2d3324!important;}
.ete-panel{background-color:#22271b!important;border-color:#2d3324!important;}
.ete-btn{background-color:#7fb35f!important;border-color:#7fb35f!important;}
.ete-btn-text{color:#0f1d07!important;}
.ete-btn-outline{border-color:#7fb35f!important;}
.ete-btn-outline-text{color:#7fb35f!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:#dde3d0!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#a3aa94!important;}
[data-ogsc] .ete-link{color:#b5dd98!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#0f110b!important;}
[data-ogsb] .ete-content{background-color:#181b13!important;}
[data-ogsb] .ete-panel{background-color:#22271b!important;border-color:#2d3324!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#f4efe2;">
<!-- 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 to confirm. Then the weekly harvest list starts on Thursday. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#f4efe2;">
<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:#fffcf4;border-radius:18px;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:Georgia, 'Times New Roman', serif;font-size:24px;line-height:30px;font-weight:700;letter-spacing:-0.3px;color:#1e2a14;">Fernhill Market</span><div class="ete-muted" style="padding-top:6px;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:11px;line-height:16px;letter-spacing:2px;text-transform:uppercase;color:#6d7262;">Organic grocer since 1998</div></td></tr>
<tr><td class="" style="padding:0;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/fernhill-basket.png" alt="Woven basket with an apple, an orange and fresh greens" width="600" height="310" class="ete-fluid" style="display:block;width:600px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;"></td></tr>
<tr><td align="center" class="ete-px" style="padding:40px 32px;background-color:#efe6cf;"><h1 class="ete-h1" style="margin:0;font-family:Georgia, 'Times New Roman', serif;font-size:32px;line-height:40px;font-weight:700;color:#24361a;text-align:center;mso-line-height-rule:exactly;">One tap to confirm</h1><p class="" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:17px;line-height:27px;color:#24361a;padding-top:14px;text-align:center;">You asked to join the Fernhill Market list with {{email}}. Please confirm so we know it was really you.</p><div style="padding-top:24px;"><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/f8a2" style="height:48px;v-text-anchor:middle;width:199px;" arcsize="50%" strokecolor="#3f6b2a" fillcolor="#3f6b2a"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Yes, sign me up</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/confirm/f8a2" style="display:inline-block;background-color:#3f6b2a;border:1px solid #3f6b2a;line-height:48px;border-radius:30px;color:#ffffff;font-family:'Trebuchet MS', Tahoma, 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, sign me up</span></a><!--<![endif]--></td></tr></table></div></td></tr>
<tr><td class="ete-px" style="padding:24px 32px 8px;"><h2 class="ete-heading ete-h2" style="margin:0;font-family:Georgia, 'Times New Roman', serif;font-size:24px;line-height:32px;font-weight:700;color:#1e2a14;text-align:center;mso-line-height-rule:exactly;">What you will get</h2></td></tr>
<tr><td class="ete-px" style="padding:12px 22px 0;"><div style="font-size:0;text-align:left;"><!--[if mso]><table role="presentation" width="556" cellpadding="0" cellspacing="0" border="0"><tr><td width="185" 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((445px - 100%) * 445);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:4px 10px 16px;"><div style="padding-top:0px;"><h3 class="ete-heading" style="margin:0;font-family:Georgia, 'Times New Roman', serif;font-size:19px;line-height:26px;font-weight:700;color:#1e2a14;text-align:center;mso-line-height-rule:exactly;">Harvest list</h3></div><p class="ete-text" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:15px;line-height:24px;color:#3d4433;padding-top:6px;text-align:center;">What came in from local farms, every Thursday.</p></td></tr></table></div><!--[if mso]></td><td width="185" 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((445px - 100%) * 445);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:4px 10px 16px;"><div style="padding-top:0px;"><h3 class="ete-heading" style="margin:0;font-family:Georgia, 'Times New Roman', serif;font-size:19px;line-height:26px;font-weight:700;color:#1e2a14;text-align:center;mso-line-height-rule:exactly;">Easy recipes</h3></div><p class="ete-text" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:15px;line-height:24px;color:#3d4433;padding-top:6px;text-align:center;">Two quick dinners built around the freshest box.</p></td></tr></table></div><!--[if mso]></td><td width="185" 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((445px - 100%) * 445);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:4px 10px 16px;"><div style="padding-top:0px;"><h3 class="ete-heading" style="margin:0;font-family:Georgia, 'Times New Roman', serif;font-size:19px;line-height:26px;font-weight:700;color:#1e2a14;text-align:center;mso-line-height-rule:exactly;">Member prices</h3></div><p class="ete-text" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:15px;line-height:24px;color:#3d4433;padding-top:6px;text-align:center;">Small weekly deals on pantry staples.</p></td></tr></table></div><!--[if mso]></td></tr></table><![endif]--></div></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-muted" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:13px;line-height:21px;color:#6d7262;text-align:center;">Did not sign up? Ignore this email and we will not write again. Button not working? Use this link: <a class="ete-link" style="color:#3f6b2a;text-decoration:underline;" href="https://example.com/confirm/f8a2">example.com/confirm/f8a2</a></p></td></tr>
<tr><td align="center" class="ete-px" style="padding:28px 32px 32px;"><p class="ete-muted" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:13px;line-height:21px;color:#6d7262;line-height:20px;text-align:center;"><strong>Fernhill Market</strong><br>7 Orchard Road, Ithaca, NY 14850</p><p class="ete-muted" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:13px;line-height:21px;color:#6d7262;line-height:20px;text-align:center;padding-top:10px;">You get this because someone entered this address on our signup form.</p><p class="ete-muted" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:13px;line-height:21px;color:#6d7262;line-height:20px;text-align:center;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#6d7262;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:'Trebuchet MS', Tahoma, sans-serif;font-size:12px;line-height:18px;color:#6d7262;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#6d7262;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
Adapted from SendGrid Email Templates by SendGrid, Inc., MIT license.
About this template
Double opt-in keeps a list clean and proves consent. This confirmation email for Fernhill Market, a sample organic grocer, makes the extra click feel worth it. A basket full of apples, oranges and greens fills the top, then a cream panel asks for one tap.
The confirm button is large and rounded. Under it, three short columns explain what arrives after confirming: the weekly harvest list, seasonal recipes and member prices. A muted line covers people who did not sign up, and a plain link backs up the button.
Send this email instantly, while the signup form is still fresh in mind. Keep the subject line short and clear about the action. Do not add a coupon here, save it for the welcome email that follows the confirmation.
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
- Basket illustration
- Confirm panel with button
- What you will get columns
- Not you note
- Footer
Subject line ideas
- Please confirm your Fernhill Market subscription
- One tap and you are on the list
- Confirm to get the weekly harvest list
Preview text idea
Tap the button to confirm. Then the weekly harvest list starts on Thursday.