- Product launch
- and Promotional, Announcement
New Follower Alert email template
A small social notification on warm off white: spaced orange wordmark, a round profile photo, name and place, who followed you and an orange pill button.
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>New Follower Alert</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-20{font-size:28px!important;line-height:31px!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:#ff8a4f!important;}
.ete-border{border-color:#34343a!important;}
.ete-panel{background-color:#26262b!important;border-color:#34343a!important;}
.ete-btn{background-color:#e64e05!important;border-color:#e64e05!important;}
.ete-btn-text{color:#ffffff!important;}
.ete-btn-outline{border-color:#e64e05!important;}
.ete-btn-outline-text{color:#e64e05!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:#ff8a4f!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;}
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-dm-sans{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=DM+Sans:wght@400;500;700&display=swap"><!--<![endif]-->
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#f8f4f2;">
<!-- 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;">Rosa Lindqvist from Oregon started following you. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#f8f4f2;">
<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;"><span class="" style="font-family:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;line-height:20px;font-weight:700;letter-spacing:3px;color:#e64e05;">LIFT & LOOP</span></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/new-follower-alert-avatar-round.png" alt="Profile photo of Rosa Lindqvist" width="104" height="104" class="" style="display:block;width:104px;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;"><h3 class="ete-heading ete-ds-20" style="margin:0;font-family:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:20px;line-height:24px;font-weight:700;color:#242424;text-align:center;mso-line-height-rule:exactly;">Rosa Lindqvist</h3></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-muted" style="margin:0;font-family:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#6f7070;text-align:center;">Oregon</p></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:14px;line-height:22px;color:#474849;text-align:center;">Rosa Lindqvist now follows you.</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/u/rosa" style="height:48px;v-text-anchor:middle;width:172px;" arcsize="50%" strokecolor="#e64e05" fillcolor="#e64e05"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">View profile</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/u/rosa" style="display:inline-block;background-color:#e64e05;border:1px solid #e64e05;line-height:48px;border-radius:24px;color:#ffffff;font-family:'DM Sans', '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;">View profile</span></a><!--<![endif]--></td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-text" style="margin:0;font-family:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:19px;color:#474849;text-align:center;"><a class="ete-link" style="color:#e64e05;text-decoration:underline;" href="{{preferences_url}}">Manage notifications</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:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#6f7070;line-height:20px;text-align:center;"><strong>Lift & Loop</strong><br>33 Cedar Avenue, Bend, OR 97701</p><p class="ete-muted" style="margin:0;font-family:'DM Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#6f7070;line-height:20px;text-align:center;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:'DM Sans', '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 (social new follower) by usewaypoint, MIT license.
About this template
A notification for a social app, fitness community or creator platform when someone new follows the user. It is centered and compact, like a profile card.
An orange wordmark in spaced capitals sits above a round profile photo. The follower’s name and home region follow, then one line says they now follow you.
An orange pill button opens their profile, and a small link under it lets people manage which notifications they get, which keeps unsubscribes down. The page around the white card is a warm off white.
Fill the photo, name and place from the follower’s profile and fall back to initials or a generic image when there is no photo. Group several follows into one email when they arrive within an hour.
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
- Round profile photo
- Name and place
- Follow line
- Profile button
- Notification settings link
- Footer
Subject line ideas
- Rosa Lindqvist now follows you
- You have a new follower
- {{first_name}}, someone new follows you
Preview text idea
Rosa Lindqvist from Oregon started following you.