SaaS Onboarding Welcome email template
A SaaS welcome email with a blue headline band and desk photo, three first steps with photos, a row of product promises and a dark help panel.
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>SaaS Onboarding Welcome</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-46{font-size:32px!important;line-height:35px!important;}
.ete-cell{padding-left:0!important;padding-right:0!important;}
.ete-icon-cell{padding-left:2px!important;padding-right:2px!important;}
.ete-icon-wrap{min-width:0!important;}
.ete-split-text{padding:32px 20px 36px!important;}
.ete-ds-28{font-size:28px!important;line-height:31px!important;}
}
@media (prefers-color-scheme: dark){
.ete-body,.ete-bg{background-color:#0a0e1c!important;}
.ete-content{background-color:#11162a!important;}
.ete-text{color:#cfd6ea!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#8e97b3!important;}
.ete-link{color:#8fb0ff!important;}
.ete-border{border-color:#232b45!important;}
.ete-panel{background-color:#171d35!important;border-color:#232b45!important;}
.ete-btn{background-color:#6f95ff!important;border-color:#6f95ff!important;}
.ete-btn-text{color:#0a0e1c!important;}
.ete-btn-outline{border-color:#6f95ff!important;}
.ete-btn-outline-text{color:#6f95ff!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:#cfd6ea!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#8e97b3!important;}
[data-ogsc] .ete-link{color:#8fb0ff!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#0a0e1c!important;}
[data-ogsb] .ete-content{background-color:#11162a!important;}
[data-ogsb] .ete-panel{background-color:#171d35!important;border-color:#232b45!important;}
body,table,td,th,p,a,span,div,li{mso-ascii-font-family:Arial;mso-hansi-font-family:Arial;mso-bidi-font-family:Arial;}
h1,h2,h3,.ete-hf{mso-ascii-font-family:Arial;mso-hansi-font-family:Arial;mso-bidi-font-family:Arial;}
.ete-f-inter{mso-ascii-font-family:Arial;mso-hansi-font-family:Arial;mso-bidi-font-family:Arial;}
.ete-f-poppins{mso-ascii-font-family:Arial;mso-hansi-font-family:Arial;mso-bidi-font-family:Arial;}
</style>
<!--[if !mso]><!--><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=Poppins:wght@400;600;700;800&display=swap"><!--<![endif]-->
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#eef2fb;">
<!-- 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 workspace is ready. Here is how to set up your first project in a few minutes. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#eef2fb;">
<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;border-radius:10px;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:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:24px;line-height:30px;font-weight:700;letter-spacing:-0.3px;color:#121a33;">Flowbase</span></td></tr>
<tr><td align="center" class="ete-px" style="padding:56px 6.67% 44px;mso-padding-alt:56px 40px 44px;background-color:#2456e6;text-align:center;"><p style="margin:0 0 12px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#cfdcff;text-align:center;">Welcome aboard</p><h1 class="ete-ds-46" style="margin:0;font-family:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:46px;line-height:50px;font-weight:700;color:#ffffff;text-align:center;mso-line-height-rule:exactly;letter-spacing:-0.5px;font-size:min(46px,7.67vw);line-height:min(50px,8.33vw);overflow-wrap:anywhere;word-break:break-word;">A simpler way to work</h1><p style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:17px;line-height:27px;color:#ffffff;padding-top:16px;text-align:center;">Plan projects, share tasks and keep your team in step, all in one place.</p><div style="padding-top:28px;"><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/app" style="height:48px;v-text-anchor:middle;width:217px;" arcsize="17%" strokecolor="#ffffff" fillcolor="#ffffff"><w:anchorlock/><center style="color:#1a44c2;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Open my workspace</center></v:roundrect><![endif]--><!--[if !mso]><!--><a href="https://example.com/app" style="display:inline-block;background-color:#ffffff;border:1px solid #ffffff;line-height:48px;border-radius:8px;color:#1a44c2;font-family:Inter, '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 style="color:#1a44c2;">Open my workspace</span></a><!--<![endif]--></td></tr></table></div></td></tr>
<tr><td class="ete-px" style="padding:0 32px 32px;background-color:#2456e6;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/saas-onboarding-welcome-hero.jpg" alt="A slim desktop screen on a light wooden desk by a curtained window" width="536" height="357" class="ete-fluid" style="display:block;width:536px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;border-radius:10px;"></td></tr>
<tr><td class="ete-px" style="padding:24px 32px 8px;"><p class="ete-link" style="margin:0 0 12px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#2456e6;text-align:center;">Get started</p><h2 class="ete-heading ete-h2" style="margin:0;font-family:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:24px;line-height:32px;font-weight:700;color:#121a33;text-align:center;mso-line-height-rule:exactly;">Your first three steps</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;"><a href="https://example.com/new-project"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/saas-onboarding-welcome-step1.jpg" alt="Two notebooks, a pen and a cup of coffee on a rustic wooden table" width="165" height="165" class="ete-fluid-cap" style="display:block;width:165px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;width:100%;max-width:280px;margin:0 auto;"></a><div style="padding-top:14px;"><h3 class="ete-heading" style="margin:0;font-family:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:19px;line-height:26px;font-weight:700;color:#121a33;text-align:center;mso-line-height-rule:exactly;">1. New project</h3></div><p class="ete-text" style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:24px;color:#3c4560;padding-top:6px;text-align:center;">Give it a name and pick a simple board or list view.</p><p style="margin:0;padding-top:10px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;font-weight:700;text-align:center;"><a class="ete-link" href="https://example.com/new-project" style="color:#2456e6;text-decoration:underline;">Create project</a></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;"><a href="https://example.com/tasks"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/saas-onboarding-welcome-step2.jpg" alt="A pale blue spiral planner on a wooden desk under a green plant" width="165" height="165" class="ete-fluid-cap" style="display:block;width:165px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;width:100%;max-width:280px;margin:0 auto;"></a><div style="padding-top:14px;"><h3 class="ete-heading" style="margin:0;font-family:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:19px;line-height:26px;font-weight:700;color:#121a33;text-align:center;mso-line-height-rule:exactly;">2. Add tasks</h3></div><p class="ete-text" style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:24px;color:#3c4560;padding-top:6px;text-align:center;">Type them in, set due dates and drag them into order.</p><p style="margin:0;padding-top:10px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;font-weight:700;text-align:center;"><a class="ete-link" href="https://example.com/tasks" style="color:#2456e6;text-decoration:underline;">Add tasks</a></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;"><a href="https://example.com/invite"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/saas-onboarding-welcome-step3.jpg" alt="A brown notebook, a pen and a binder clip on a white desk" width="165" height="165" class="ete-fluid-cap" style="display:block;width:165px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;width:100%;max-width:280px;margin:0 auto;"></a><div style="padding-top:14px;"><h3 class="ete-heading" style="margin:0;font-family:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:19px;line-height:26px;font-weight:700;color:#121a33;text-align:center;mso-line-height-rule:exactly;">3. Invite team</h3></div><p class="ete-text" style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:24px;color:#3c4560;padding-top:6px;text-align:center;">Send a link so everyone sees the same plan.</p><p style="margin:0;padding-top:10px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;font-weight:700;text-align:center;"><a class="ete-link" href="https://example.com/invite" style="color:#2456e6;text-decoration:underline;">Invite people</a></p></td></tr></table></div><!--[if mso]></td></tr></table><![endif]--></div></td></tr>
<tr><td class="ete-px" style="padding:28px 32px 12px;"><div style="font-size:0;text-align:center;"><!--[if mso]><table role="presentation" width="536" cellpadding="0" cellspacing="0" border="0"><tr><td width="178" valign="top"><![endif]--><div class="ete-icon-wrap" style="display:inline-block;vertical-align:top;width:33.33%;min-width:94px;max-width:100%;font-size:16px;text-align:center;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-icon-cell" style="padding:0 8px 16px;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/icon-users-4a74f0.png" alt="" width="36" height="36" class="" style="display:block;width:36px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;margin:0 auto;"><p class="ete-heading" style="margin:0;padding-top:10px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:19px;font-weight:700;color:#121a33;text-align:center;">Work together</p><p class="ete-muted" style="margin:0;padding-top:4px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;color:#68708c;text-align:center;">Comments on every task</p></td></tr></table></div><!--[if mso]></td><td width="178" valign="top"><![endif]--><div class="ete-icon-wrap" style="display:inline-block;vertical-align:top;width:33.33%;min-width:94px;max-width:100%;font-size:16px;text-align:center;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-icon-cell" style="padding:0 8px 16px;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/icon-check-4a74f0.png" alt="" width="36" height="36" class="" style="display:block;width:36px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;margin:0 auto;"><p class="ete-heading" style="margin:0;padding-top:10px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:19px;font-weight:700;color:#121a33;text-align:center;">Stay on track</p><p class="ete-muted" style="margin:0;padding-top:4px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;color:#68708c;text-align:center;">Clear owners and dates</p></td></tr></table></div><!--[if mso]></td><td width="178" valign="top"><![endif]--><div class="ete-icon-wrap" style="display:inline-block;vertical-align:top;width:33.33%;min-width:94px;max-width:100%;font-size:16px;text-align:center;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-icon-cell" style="padding:0 8px 16px;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/icon-clock-4a74f0.png" alt="" width="36" height="36" class="" style="display:block;width:36px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;margin:0 auto;"><p class="ete-heading" style="margin:0;padding-top:10px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:19px;font-weight:700;color:#121a33;text-align:center;">Less busywork</p><p class="ete-muted" style="margin:0;padding-top:4px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;color:#68708c;text-align:center;">Reminders sent for you</p></td></tr></table></div><!--[if mso]></td></tr></table><![endif]--></div></td></tr>
<tr><td height="8" style="height:8px;font-size:0;line-height:0;mso-line-height-rule:exactly;"> </td></tr>
<tr><td class="" style="padding:0;"><div style="font-size:0;text-align:left;display:flex;flex-wrap:wrap;background-color:#121a33;"><!--[if mso]><table role="presentation" width="600" bgcolor="#121a33" cellpadding="0" cellspacing="0" border="0"><tr><td width="263" valign="middle"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:middle;min-width:43.83%;max-width:100%;width:43.83%;width:calc((480px - 100%) * 480);font-size:16px;text-align:left;align-self:flex-start;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/saas-onboarding-welcome-help.jpg" alt="A person writes notes with a pen in an open notebook on their lap" width="263" height="329" class="ete-fluid" style="display:block;width:263px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;width:100%;"></div><!--[if mso]></td><td width="337" valign="middle"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:middle;min-width:56.16%;max-width:100%;width:56.16%;width:calc((480px - 100%) * 480);font-size:16px;text-align:left;align-self:center;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-split-text" style="padding:40px 32px;"><p style="margin:0 0 12px;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#8fb0ff;text-align:left;">Need a hand?</p><h1 class="ete-ds-28" style="margin:0;font-family:Poppins, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:28px;line-height:34px;font-weight:700;color:#ffffff;text-align:left;mso-line-height-rule:exactly;">Real people, quick answers</h1><p style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:17px;line-height:27px;color:#ffffff;padding-top:16px;text-align:left;">Our support team reads every message. Guides and short videos are in the help center.</p><div style="padding-top:28px;"><table role="presentation" cellpadding="0" cellspacing="0" border="0"><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/help" style="height:48px;v-text-anchor:middle;width:217px;" arcsize="17%" strokecolor="#ffffff" fillcolor="#ffffff"><w:anchorlock/><center style="color:#121a33;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Visit help center</center></v:roundrect><![endif]--><!--[if !mso]><!--><a href="https://example.com/help" style="display:inline-block;background-color:#ffffff;border:1px solid #ffffff;line-height:48px;border-radius:8px;color:#121a33;font-family:Inter, '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 style="color:#121a33;">Visit help center</span></a><!--<![endif]--></td></tr></table></div></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:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#68708c;line-height:20px;text-align:center;"><strong>Flowbase</strong><br>400 Market Street, Floor 6, San Francisco, CA 94111</p><p class="ete-muted" style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#68708c;line-height:20px;text-align:center;padding-top:10px;">You get this email because you created a Flowbase account.</p><p class="ete-muted" style="margin:0;font-family:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#68708c;line-height:20px;text-align:center;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#68708c;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:Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:18px;color:#68708c;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#68708c;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
About this template
A first email for new users of a work app, project tool or any SaaS product with a short setup. It opens on a bright blue band with a clear headline, one line about what the product does, and a white button that takes the user straight into their workspace. A calm photo of a tidy desk by the window sits inside the same band.
Below, three numbered steps show the user what to do first: set up a project, add tasks and invite the team. Each step has a small photo and one line of help. A row of three blue line icons follows with what the product promises, then a dark split panel offers help from real people, with a photo of someone writing notes and a link to the help center.
Clean blue, white and a round sans for headings keep it friendly and clear.
Change the three steps to match your setup flow, point the buttons at your app, and send it the moment someone signs up.
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
- Blue headline band with desk photo
- Three first steps
- Icon row
- Help split panel
- Footer
Subject line ideas
- Welcome to Flowbase, {{first_name}}
- Three steps to your first project
- Your workspace is ready
Preview text idea
Your workspace is ready. Here is how to set up your first project in a few minutes.