Subscription Receipt email template
A subscription receipt for a SaaS plan: plan line items, discount and tax, the total, billing and payment columns and a button to download the invoice.
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>Subscription Receipt</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:#0f0c16!important;}
.ete-content{background-color:#191523!important;}
.ete-text{color:#dbd5ea!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#a39cb8!important;}
.ete-link{color:#c4a5ff!important;}
.ete-border{border-color:#2e2840!important;}
.ete-panel{background-color:#221d30!important;border-color:#2e2840!important;}
.ete-btn{background-color:#7c3aed!important;border-color:#7c3aed!important;}
.ete-btn-text{color:#ffffff!important;}
.ete-btn-outline{border-color:#7c3aed!important;}
.ete-btn-outline-text{color:#7c3aed!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:#dbd5ea!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#a39cb8!important;}
[data-ogsc] .ete-link{color:#c4a5ff!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#0f0c16!important;}
[data-ogsb] .ete-content{background-color:#191523!important;}
[data-ogsb] .ete-panel{background-color:#221d30!important;border-color:#2e2840!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#f4f1fb;">
<!-- 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;">Thanks for renewing Draftly Pro. No payment is due, this is your receipt. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#f4f1fb;">
<tr><td align="center" class="ete-outer" style="padding:24px 12px;">
<!--[if mso]><table role="presentation" width="620" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table role="presentation" class="ete-container" width="620" cellpadding="0" cellspacing="0" border="0" style="width:100%;max-width:620px;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:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:24px;line-height:30px;font-weight:700;letter-spacing:-0.3px;color:#1c1530;">Draftly</span></td></tr>
<tr><td align="left" class="ete-px" style="padding:40px 32px;"><h1 class="ete-heading ete-h1" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:32px;line-height:40px;font-weight:700;color:#1c1530;text-align:left;mso-line-height-rule:exactly;">Receipt for your Draftly plan</h1><p class="ete-text" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:17px;line-height:27px;color:#3f3a4f;padding-top:14px;text-align:left;">Thanks, {{first_name}}. Your payment went through and your plan is active until 30 September 2027. No payment is due.</p></td></tr>
<tr><td class="ete-px" style="padding:16px 32px;"><h2 class="ete-heading ete-h2" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:24px;line-height:32px;font-weight:700;color:#1c1530;text-align:left;mso-line-height-rule:exactly;">Receipt DR-50417</h2><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:14px;line-height:22px;color:#716b82;padding-top:4px;">Paid on 1 October 2026</p><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top:16px;"><tr><td class="ete-text ete-border" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e2f3;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;"><strong>Draftly Pro, yearly</strong><br><span class="ete-muted" style="color:#716b82;font-size:13px;">1 Oct 2026 to 30 Sep 2027</span></td><td class="ete-text ete-border" align="right" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e2f3;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;;white-space:nowrap;">$96.00</td></tr><tr><td class="ete-text ete-border" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e2f3;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;"><strong>Extra team seats</strong><br><span class="ete-muted" style="color:#716b82;font-size:13px;">$24.00 per seat per year</span></td><td class="ete-text ete-border" align="right" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e2f3;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;;white-space:nowrap;">$48.00</td></tr></table><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top:8px;"><tr><td class="ete-muted" style="padding:4px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#716b82;">Subtotal</td><td class="ete-text" align="right" style="padding:4px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;">$144.00</td></tr><tr><td class="ete-muted" style="padding:4px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#716b82;">Loyalty discount</td><td class="ete-text" align="right" style="padding:4px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;">-$14.40</td></tr><tr><td class="ete-muted" style="padding:4px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#716b82;">Sales tax (7.5%)</td><td class="ete-text" align="right" style="padding:4px 0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:22px;color:#3f3a4f;">$9.60</td></tr><tr><td class="ete-heading" style="padding:12px 0 0;border-top:2px solid #1c1530;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:17px;line-height:24px;font-weight:700;color:#1c1530;">Total paid</td><td class="ete-heading" align="right" style="padding:12px 0 0;border-top:2px solid #1c1530;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:17px;line-height:24px;font-weight:700;color:#1c1530;">$139.20</td></tr></table></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="576" cellpadding="0" cellspacing="0" border="0"><tr><td width="288" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:50%;max-width:100%;width:50%;width:calc((461px - 100%) * 461);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:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:19px;line-height:26px;font-weight:700;color:#1c1530;text-align:left;mso-line-height-rule:exactly;">Billed to</h3></div><p class="ete-text" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:24px;color:#3f3a4f;padding-top:6px;text-align:left;">Jonah Pierce<br>
Pierce Copy Co.<br>
310 Elm Street, Dayton, OH 45402</p></td></tr></table></div><!--[if mso]></td><td width="288" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:50%;max-width:100%;width:50%;width:calc((461px - 100%) * 461);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:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:19px;line-height:26px;font-weight:700;color:#1c1530;text-align:left;mso-line-height-rule:exactly;">Paid with</h3></div><p class="ete-text" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:15px;line-height:24px;color:#3f3a4f;padding-top:6px;text-align:left;">Card ending in 8812<br>
Shows as DRAFTLY APP on your statement</p></td></tr></table></div><!--[if mso]></td></tr></table><![endif]--></div></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/invoices/DR-50417" style="height:48px;v-text-anchor:middle;width:262px;" arcsize="0%" strokecolor="#7c3aed" fillcolor="#7c3aed"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Download invoice (PDF)</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/invoices/DR-50417" style="display:inline-block;background-color:#7c3aed;border:1px solid #7c3aed;line-height:48px;border-radius:0px;color:#ffffff;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 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;">Download invoice (PDF)</span></a><!--<![endif]--></td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:14px;line-height:22px;color:#716b82;text-align:left;">New card or new address? <a class="ete-link" style="color:#6d28d9;text-decoration:underline;" href="https://example.com/billing">Update your billing details</a> any time. Questions about this charge? Reply to this email.</p></td></tr>
<tr><td align="left" class="ete-px" style="padding:28px 32px 32px;"><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:13px;line-height:21px;color:#716b82;line-height:20px;text-align:left;"><strong>Draftly Software LLC</strong><br>77 Paper Mill Road, Dayton, OH 45402</p><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:13px;line-height:21px;color:#716b82;line-height:20px;text-align:left;padding-top:10px;">Billing email for your Draftly account.</p><p class="ete-muted" style="margin:0;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:13px;line-height:21px;color:#716b82;line-height:20px;text-align:left;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#716b82;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:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;font-size:12px;line-height:18px;color:#716b82;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#716b82;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
This receipt is for software that bills by plan, such as Draftly, our sample writing app. It confirms that the payment went through and lists exactly what the customer paid for, so finance teams can file it without asking questions.
A short purple intro says no payment is due. The summary lists the yearly plan and the extra seats with their billing period, then the discount, tax and a bold total. Two columns show who was billed and which card was charged. A button downloads the PDF invoice, and a muted line explains how to change billing details.
Send it as soon as the charge clears. Put the amount and the plan name in the subject line. If you sell to companies, add the customer tax ID to the Billed to column.
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
- Receipt intro
- Plan line items
- Discount, tax and total
- Billed to and paid with columns
- Download invoice button
- Billing help note
- Footer
Subject line ideas
- Your Draftly receipt for $139.20
- Payment received: Draftly Pro, yearly
- Receipt for invoice DR-50417
Preview text idea
Thanks for renewing Draftly Pro. No payment is due, this is your receipt.