Preview did not load.
Marketplace Welcome Video email template
A welcome letter for a B2B safety tool: a plain greeting, a product video with a play button, quick start link, a blue dashboard button and a market photo.
Light shows the email as designed. Dark and Gmail show how email apps can change its colors.
11.5 KB, under the 102 KB where Gmail cuts emails
<!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>Marketplace Welcome Video</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-video-320{height:200px!important;}
}
@media (prefers-color-scheme: dark){
.ete-body,.ete-bg{background-color:#121212!important;}
.ete-content{background-color:#1c1c1e!important;}
.ete-text{color:#d4d4d6!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#9c9ca3!important;}
.ete-link{color:#5fb4ef!important;}
.ete-border{border-color:#34343a!important;}
.ete-panel{background-color:#26262b!important;border-color:#34343a!important;}
.ete-btn{background-color:#0079cc!important;border-color:#0079cc!important;}
.ete-btn-text{color:#ffffff!important;}
.ete-btn-outline{border-color:#0079cc!important;}
.ete-btn-outline-text{color:#0079cc!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:#d4d4d6!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#9c9ca3!important;}
[data-ogsc] .ete-link{color:#5fb4ef!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#121212!important;}
[data-ogsb] .ete-content{background-color:#1c1c1e!important;}
[data-ogsb] .ete-panel{background-color:#26262b!important;border-color:#34343a!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#f2f5f7;">
<!-- 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;">Watch the two minute tour and connect your messaging tools. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#f2f5f7;">
<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="left" class="ete-px" style="padding:28px 32px 20px;"><span class="ete-heading" style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:20px;line-height:25px;font-weight:700;letter-spacing:-0.3px;color:#242424;">Tradeguard</span></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:22px;color:#242424;text-align:left;">Hi {{first_name}},</p></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:22px;color:#242424;text-align:left;">Welcome to Tradeguard! Tradeguard helps teams in fast growing marketplaces watch conversations, <a class="ete-link" style="color:#0079cc;text-decoration:underline;" href="https://example.com/features/off-platform">stop off-platform deals</a>, spot problem users and keep their community safe.</p></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:22px;color:#242424;text-align:left;">Best of all, you can connect the messaging tools you already use in minutes:</p></td></tr>
<tr><td class="ete-px" style="padding:12px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td bgcolor="#111111" background="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/marketplace-welcome-video-video.jpg" align="center" valign="middle" height="320" class="ete-video-320" style="height:320px;background-color:#111111;background-image:url('https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/marketplace-welcome-video-video.jpg');background-position:center center;background-size:cover;background-repeat:no-repeat;"><!--[if gte mso 9]><v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:536px;height:320px;"><v:fill type="frame" src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/marketplace-welcome-video-video.jpg" color="#111111" /><v:textbox inset="0,0,0,0" style="v-text-anchor:middle;"><center><![endif]--><a href="https://example.com/tour" aria-label="Play video: Two people working on laptops at a shared desk with notes, play the product tour" style="display:inline-block;width:72px;height:72px;border-radius:36px;background-color:#ffffff;color:#242424;font-family:Arial,sans-serif;font-size:26px;line-height:72px;text-align:center;text-decoration:none;mso-line-height-rule:exactly;"><span style="padding-left:5px;color:#242424;">▶</span></a><!--[if gte mso 9]></center></v:textbox></v:rect><![endif]--></td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:22px;color:#242424;text-align:left;">We also recommend starting with our <a class="ete-link" style="color:#0079cc;text-decoration:underline;" href="https://example.com/quick-start">quick start guide</a>.</p></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:22px;color:#242424;text-align:left;">If you ever need help, just reply to this email and one of us will get back to you shortly. We are here to help.</p></td></tr>
<tr><td align="left" class="ete-px" style="padding:16px 32px;"><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/dashboard" style="height:48px;v-text-anchor:middle;width:190px;" arcsize="4%" strokecolor="#0079cc" fillcolor="#0079cc"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Open dashboard</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/dashboard" style="display:inline-block;background-color:#0079cc;border:1px solid #0079cc;line-height:48px;border-radius:2px;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;">Open dashboard</span></a><!--<![endif]--></td></tr></table></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/marketplace-welcome-video-market.jpg" alt="Fruit seller weighing limes on a scale at a street market stall" width="536" height="320" class="ete-fluid" style="display:block;width:536px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;margin:0 auto;"></td></tr>
<tr><td align="left" 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:#6f7070;line-height:20px;text-align:left;"><strong>Tradeguard</strong><br>220 Battery Street, San Francisco, CA 94111</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#6f7070;line-height:20px;text-align:left;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#6f7070;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:#6f7070;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#6f7070;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
Adapted from Waypoint responsive transactional email templates (saas welcome) by usewaypoint, MIT license.
About this template
A welcome email for a business software product that is easier to show than to explain. It reads like a letter from the team, with a short video in the middle.
A dark wordmark opens the email, followed by a greeting and a paragraph that explains what the product does in one sentence, with a link to the key feature. A second line says setup takes minutes.
The video block shows a photo of a team at work with a round play button that links to the product tour. After the video come a link to the quick start guide, an offer to reply for help and a blue button to the dashboard.
A wide photo of a street market closes the email and hints at the marketplaces the product serves. Record a two minute tour and link it from the video block.
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
- Greeting and product line
- Video with play button
- Quick start link
- Help line
- Dashboard button
- Market photo
- Footer
Subject line ideas
- Welcome to Tradeguard, {{first_name}}
- Watch the two minute tour
- Your Tradeguard account is ready
Preview text idea
Watch the two minute tour and connect your messaging tools.
Preview did not load.
Preview did not load.
Preview did not load.
Preview did not load.
Preview did not load.
- Jobs and HR
- Welcome
- and Onboarding
Preview did not load.
Preview did not load.
Preview did not load.