Team Workspace Invitation email template
An invitation email for a team tool: who invited you, the workspace name, a big accept button, a fallback link and a small board picture of what you can do.
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>Team Workspace Invitation</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:#08100f!important;}
.ete-content{background-color:#111c1b!important;}
.ete-text{color:#cfe2df!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#93aaa6!important;}
.ete-link{color:#5eead4!important;}
.ete-border{border-color:#22403c!important;}
.ete-panel{background-color:#16302d!important;border-color:#22403c!important;}
.ete-btn{background-color:#14b8a6!important;border-color:#14b8a6!important;}
.ete-btn-text{color:#062320!important;}
.ete-btn-outline{border-color:#14b8a6!important;}
.ete-btn-outline-text{color:#14b8a6!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:#cfe2df!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#93aaa6!important;}
[data-ogsc] .ete-link{color:#5eead4!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#08100f!important;}
[data-ogsb] .ete-content{background-color:#111c1b!important;}
[data-ogsb] .ete-panel{background-color:#16302d!important;border-color:#22403c!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#e9f3f2;">
<!-- 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;">Maya Chen added you to the Northfield Design workspace. Accept to start. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#e9f3f2;">
<tr><td align="center" class="ete-outer" style="padding:24px 12px;">
<!--[if mso]><table role="presentation" width="580" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table role="presentation" class="ete-container" width="580" cellpadding="0" cellspacing="0" border="0" style="width:100%;max-width:580px;margin:0 auto;">
<tr><td class="ete-content" style="background-color:#ffffff;border-radius:6px;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;background-color:#0f766e;"><span class="" style="font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:24px;line-height:30px;font-weight:700;letter-spacing:-0.3px;color:#ffffff;">Kanbo</span></td></tr>
<tr><td align="center" class="ete-px" style="padding:40px 32px;"><p style="margin:0 0 12px;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:12px;line-height:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#0f766e;text-align:center;">You are invited</p><h1 class="ete-heading ete-h1" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:32px;line-height:40px;font-weight:700;color:#0b2f2c;text-align:center;mso-line-height-rule:exactly;">Maya Chen invited you to join <b>Northfield Design</b></h1><p class="ete-text" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:17px;line-height:27px;color:#334744;padding-top:14px;text-align:center;">Maya uses Kanbo to plan projects with the team. Accept the invite to see the boards, pick up tasks and leave comments.</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/invite/8F2KQ" style="height:48px;v-text-anchor:middle;width:217px;" arcsize="8%" strokecolor="#0f766e" fillcolor="#0f766e"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Accept invitation</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/invite/8F2KQ" style="display:inline-block;background-color:#0f766e;border:1px solid #0f766e;line-height:48px;border-radius:4px;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;">Accept invitation</span></a><!--<![endif]--></td></tr></table></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:#5f7471;text-align:center;">Button not working? Paste this link into your browser: <a class="ete-link" style="color:#0f766e;text-decoration:underline;" href="https://example.com/invite/8F2KQ">example.com/invite/8F2KQ</a>. The invite stays open for 7 days.</p></td></tr>
<tr><td class="ete-px" style="padding:20px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-border" style="border-top:1px solid #d8e7e5;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:12px 20px 0;"><div style="font-size:0;text-align:left;display:flex;flex-wrap:wrap;"><!--[if mso]><table role="presentation" width="540" cellpadding="0" cellspacing="0" border="0"><tr><td width="240" valign="middle"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:middle;min-width:44.44%;max-width:100%;width:44.44%;width:calc((432px - 100%) * 432);font-size:16px;text-align:left;align-self:flex-start;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:4px 12px 16px;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/kanbo-board.png" alt="Small project board with colored task cards in three columns" width="216" height="162" class="ete-fluid-cap" style="display:block;width:216px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;width:100%;max-width:280px;margin:0 auto;"></td></tr></table></div><!--[if mso]></td><td width="300" valign="middle"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:middle;min-width:55.55%;max-width:100%;width:55.55%;width:calc((432px - 100%) * 432);font-size:16px;text-align:left;align-self:center;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:4px 12px 16px;"><h3 class="ete-heading" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:19px;line-height:26px;font-weight:700;color:#0b2f2c;text-align:left;mso-line-height-rule:exactly;">What you can do in Kanbo</h3><p class="ete-text" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:15px;line-height:24px;color:#334744;padding-top:8px;">Drag tasks across columns, assign them to teammates and set due dates. Every change shows up for the whole team right away.</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-text" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:15px;line-height:24px;color:#334744;text-align:center;">Questions for Maya? Just reply to this email and it goes straight to her.</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:#5f7471;line-height:20px;text-align:center;"><strong>Kanbo Labs</strong><br>88 Harbor Road, Unit 4, Halifax, NS B3H 1A1</p><p class="ete-muted" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:13px;line-height:21px;color:#5f7471;line-height:20px;text-align:center;padding-top:10px;">You got this email because a Kanbo user invited this address to a workspace.</p><p class="ete-muted" style="margin:0;font-family:'Trebuchet MS', Tahoma, sans-serif;font-size:13px;line-height:21px;color:#5f7471;line-height:20px;text-align:center;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#5f7471;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:#5f7471;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#5f7471;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
Adapted from Postmark Transactional Email Templates by Wildbit (now ActiveCampaign), MIT license.
About this template
When a teammate adds someone to a shared workspace, this is the email that lands. It answers the two questions every invitee has: who sent this, and is it safe to click. The inviter name and the workspace name sit right in the teal header area, followed by one large accept button.
Under the button, a muted line gives a plain link for people whose mail app blocks buttons. A small board illustration then shows what Kanbo does, with a short list of first actions. The footer explains why the person got the email.
Put the inviter name in the subject line, because people open mail from colleagues faster than mail from apps. Set the invite link to expire after a week and say so in the email. If your tool has roles, add the role the person will get next to the workspace name.
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
- Logo band
- Invite heading and accept button
- Fallback link
- Divider
- Board illustration with what you can do
- Reply note
- Footer
Subject line ideas
- Maya Chen invited you to Northfield Design on Kanbo
- Join your team board on Kanbo
- {{inviter_name}} wants you on the Northfield Design board
Preview text idea
Maya Chen added you to the Northfield Design workspace. Accept to start.