Free HTML Email Templates

Free HTML email templates, from modern and simple designs to attractive marketing emails. Customize them for your brand and create responsive email templates that work seamlessly across all devices and email clients. Export as HTML or PDF with high quality visuals, reliable performance, and professional results for your campaigns.

Free HTML Email Templates from Tabular's Email Builder

Email templates are at the heart of modern communication between brands and customers. Tabular offers free HTML email templates that you can customize using an easy to use drag and drop email editor and export as either PDF or HTML for free.

In this page of Tabular's email templates gallery, you can find solutions to your email communication with high quality, high performance, responsive html email templates that will be useful in every industry, seasonal event and use case.

Transactional emails are used widely across SaaS companies, online stores, and service businesses. In every business where you can create an account, you need account confirmation emails. In every business that sells physical products, you need shipping confirmation emails, and any business that accepts payments online needs payment confirmation emails.

Tabular also provides an extensive list of promotional email templates designed to extend your customer relationship beyond essential transactions. Tabular works with professional designers to provide email templates reaching everything from new product announcements and exclusive sales to re-engagement campaigns and holiday promotions. At Tabular, we prioritize quality over quantity. Every email template you are seeing on this page is free and designed by professional email marketers and designers.

Can’t find the template you are looking for? Please don’t hesitate to contact us and create a request for a bundle.

Turn Basic HTML Email Templates to Branded Professional Messages

Password Notification Emails

Password and authentication emails are essential for any business that wants to have a professional connection and branding. It closes the knowledge gap, gives the trust that users need, and decreases the request for customer support tickets. And increases the revenue by decreasing the costs.

Password Forgot Emails

An email template for a forgotten password notification built with Tabular’s email template builder.

Password forgot emails help users quickly recover access. A clear call-to-action button, expiration notice, and secure tokenized link are essential UX and security elements.

How to customize this email template:

  • Use prebuilt password recovery modules with CTA buttons
  • Add dynamic reset links using personalization variables
  • Design mobile-friendly layouts without coding
  • Export responsive HTML for your authentication workflow

Password Reset Notification

An email template for a password reset notification built with Tabular’s email template builder.

Reset confirmation emails reassure users that for updated credentials successfully and help prevent unauthorized changes.

How to customize this email template:

  • Build simple confirmation layouts with icon-based feedback
  • Include security tips or support links as reusable blocks
  • Maintain brand consistency across transactional emails
  • Export clean HTML compatible with any ESP or SaaS backend

Password Changed Notification Emails

An email template for a password change notification built with Tabular’s email template builder.

Security-focused transactional email informing users about credential updates, often including device or location data.

How to customize this email template:

  • Add structured information blocks for device, time, or IP details
  • Use alert-style components for stronger visual hierarchy
  • Reuse template sections for all security-related notifications
  • Customize styling with inline CSS while staying client-compatible

Email Verification / Confirm Your Account

Verification emails increase deliverability and reduce spam complaints while validating real users. They are foundational for onboarding flows and marketing consent.

An email template for account confirmation built with Tabular’s email template builder.

How to customize this email template:

  • Create verification CTA buttons with strong visual contrast
  • Use countdown or expiration notices to encourage action
  • Personalize greetings and account details dynamically
  • Generate and Export verification templates as responsive HTML emails

User Sign-in Activity Notification

An email template for a new sign in notification built with Tabular’s email template builder.

Security alerts highlighting suspicious login attempts or new device access. These emails strengthen user trust and platform transparency.

How to customize this email template:

  • Build alert-style layouts with highlighted activity details
  • Add support or “secure your account” action buttons
  • Structure security information using scannable content blocks
  • Save reusable modules for future security notifications

Onboarding and Welcome Emails

Onboarding emails introduce users to your product, build trust, and guide activation. These templates benefit from clear hierarchy, personalization, and responsive HTML email design to ensure a smooth first experience across devices.

Welcome to The Team Email Templates

An email template for welcoming new users that is built with Tabular’s email template builder.

Internal or SaaS onboarding email introducing collaboration tools, documentation, and workspace access.

How to customize this email template:

  • Use modular layouts for onboarding steps and resources
  • Add personalized team or workspace information dynamically
  • Include CTA buttons for first actions inside the platform
  • Export clean HTML templates for internal or SaaS onboarding flows

Membership Welcome Message Email Template

An email template for welcoming new members built with Tabular’s email template builder.

First impression email focused on brand voice, product benefits, and activation steps.

How to customize this email template:

  • Combine hero sections with benefit-driven content blocks
  • Add product screenshots or feature highlights easily
  • Personalize greetings and onboarding instructions
  • Save reusable welcome modules for consistent onboarding

Promotional and Sales Email Templates

Promotional emails drive conversions, product awareness, and seasonal revenue. Strong visuals, urgency elements, and responsive design are key for effective promotion and sales campaigns.

Black Friday and Cyber Monday

High-conversion promotional templates designed for urgency, countdown timers, and sales messaging.

An email templates for Black Friday, built with Tabular’s email template builder.

How to customize this email template:

  • Add countdown timers and urgency banners
  • Use bold CTA buttons and promotional badges
  • Build reusable sale layouts for recurring campaigns
  • Export HTML templates ready for high-volume sending

Product Launch Email Templates

An email template for product launch built with Tabular’s email template builder.

Announcement emails highlighting new features, release notes, and early adoption incentives.

How to customize this email template:

  • Showcase feature highlights with image-text modules
  • Add announcement banners and release notes sections
  • Include CTA buttons for demos or product pages
  • Maintain responsive layouts with clean HTML structure

Abandoned Cart Reminder Email Templates

An abandoned cart email template built with Tabular’s email template builder.

Behavior-triggered email recovering lost revenue by reminding users about incomplete purchases.

How to customize this email template:

  • Use product card modules for cart items
  • Add urgency messaging and discount incentives
  • Personalize recommendations dynamically
  • Export cart recovery templates compatible with ESP automation

Newsletter Templates

Newsletters strengthen relationships, share content, and support long-term engagement strategies. Modular layouts and strong typography hierarchy improve readability and click-through rates.

Monthly / Simple Email Newsletter

A email newsletter template built with Tabular’s email template builder.

Recurring content format for updates, education, and brand awareness campaigns.

How to customize this email template:

  • Build reusable content blocks for recurring campaigns
  • Add article previews or update sections easily
  • Maintain consistent layout across newsletter editions
  • Export responsive HTML for any email marketing platform

Single Post Newsletter Email Template

A single post email newsletter template built with Tabular’s email template builder.

Focused announcement email ideal for blog promotion or feature updates.

How to customize this email template:

  • Create minimalist layouts centered on one story
  • Add hero images and strong CTA buttons
  • Optimize spacing and readability for mobile devices
  • Export lightweight HTML templates for content promotion

Transactional Email Templates and Order Confirmation Emails

Transactional emails confirm user actions and build post-purchase trust. These templates should prioritize clarity, accessibility, and reliable rendering.

Order Confirmation Emails

Order confirmation email template built with Tabular’s email template builder.

Essential transactional email confirming purchase details and next steps.

How to customize this email template:

  • Use structured order summary modules
  • Add shipping or billing information blocks
  • Include support and tracking links as reusable sections
  • Export HTML optimized for transactional delivery

Payment Confirmation Emails

Payment confirmation email template built with Tabular's no code email template builder.

Receipt-style email with billing information and invoice details.

How to customize this email template:

  • Design invoice-style layouts with clear data hierarchy
  • Add downloadable invoice or receipt links
  • Maintain consistent brand styling across transactional emails
  • Reuse payment modules for automation workflows

Subscription Confirmation Emails

A email newsletter template built with Tabular’s email template builder.

Recurring billing confirmation email clarifying renewal cycles and plan benefits.

How to customize this email template:

  • Highlight subscription details with structured content blocks
  • Add renewal reminders or account management links
  • Personalize plan information dynamically
  • Export responsive templates for subscription SaaS

Order Delivered Email Template

Order delivered email template built with Tabular’s email template builder.

Customer satisfaction email marking order completion and enabling cross-sell opportunities.

How to customize this email template with Tabular's Email Builder:

  • Add delivery summaries and product visuals
  • Include feedback or review CTA buttons
  • Use recommendation blocks for cross-selling
  • Save delivery modules for future automation workflows

Get Your Free Professionally Designed Responsive HTML Email Template

Tabular's email templates are built with:

  • Mobile-first responsive architecture
  • Full compatibility with all major email clients, including older versions of Outlook
  • Conversion-focused layouts
  • Modern design trends

HTML Email Templates for High-Performing Email Marketing Campaigns

Our goal is to only offer quality email designs that perform. That's why we have a pool of talented professional designers that stay up-to-date with the latest design trends, and we carefully curate our collection to keep it up with our current standards so you can use Tabular's email templates with peace of mind.

Here, at Tabular, we believe in quality over quantity. So we try to create each html email template purposefully with specific styling, industries, applications, marketing goals, or customer journeys in mind.

No coding, pure design: Customize each Email Template HTML with Tabular's Drag-and-Drop Editor to align with your brand

Create html emails faster with our drag-and-drop editor featuring:

  • 250+ premade modules (headers, product grids, CTAs)
  • Conditional content blocks for personalized offers/audiences
  • Team element library for synchronized brand components
  • 2,500+ icon library (FontAwesome/Feather/Heroicons) with color customization

Try starting from scratch if you can't find the email you're looking for. Tabular's intuitive drag-and-drop builder allows you to create your own email in minutes, without seeing a single line of code.

Tabular's email builder offers you a set of fundamental elements with which you can easily construct complex email structures. In addition, we offer a selection of more than 200 premade email modules based on the fundamental elements.

The premade modules help you to stop reinventing the wheel and immediately add common email components such as headers, content, products, social media icons and footers.

In addition, you can also create your own team blocks that you can re-use and synchronize between different emails. This helps you to streamline your email creation process if you have multiple emails with for example the same footer and social media icons.

Responsive HTML Email Templates that Look Good in Every Inbox

Build responsive email templates with:

  • Dedicated mobile styling mode
  • Device-specific color schemes
  • Element stacking control
  • Touch-friendly sizing presets

Tabular's email editor allows you to visually change how your email looks on mobile devices. You do this by going in-to mobile design mode while designing. Any styling change you make while in mobile mode will only be specific to mobile devices. This allows you to create a drastically different experience for your mobile email readers. For example, you can have a completely purple-looking email in desktop email clients while it is completely blue-looking on mobile.

HTML Email Templates for Gmail, Outlook, HubSpot, Klaviyo, Mailchimp, and more

KlaviyoSendGridHubSpotBrevoMailchimpPostmarkMailgunKlaviyoSendGridHubSpotBrevoMailchimpPostmarkMailgunKlaviyoSendGridHubSpotBrevoMailchimpPostmarkMailgunKlaviyoSendGridHubSpotBrevoMailchimpPostmarkMailgun

Design to Email Template HTML with just a few clicks

Our smart HTML generator provides a pixel-perfect rendering across all clients. With Tabular's email builder you'd have:

  • Direct integrations with 20+ platforms:
    • HubSpot, Postmark, Mailchimp, Crisp, Mailgun, Brevo (Sendinblue), Klaviyo, SendGrid, Sendy, MailerLite, Mailjet, Auth0, Moosend, VBOUT, ZeptoMail, SendPulse, Acumbamail, Transpond, Encharge, Mailercloud, Iterable, Selzy, Campaign Monitor
  • Option to manually download HTML email templates
  • Real-time CDN hosting (20GB-250GB quotas)
  • Version control & testing
html

We built a smart algorithm that automatically converts your email design to HTML for all environments.

When using Tabular's HTML email templates, you can rest assured knowing email is mobile-first responsive and looks great on all major email clients, even the Outlook desktop clients.

Turn Basic HTML Email Templates into Professional Branded Designs with Tabular’s Email Builder

You can export the HTML for your email for free by downloading, copying or optionally uploading it to your sending platform directly.

Tabular gives you the freedom to fully control and deploy your email templates wherever you need, by providing you with the complete HTML code.

Email Marketing Templates for Every Situation

Do you need a template to welcome new subscribers, promote a special offer, or wish your customers happy holidays? We've got you covered! Explore our wide range of professionally designed HTML email templates:

Tabular's email templates offer a solution for each stage of the customer journey helps create a smooth and engaging experience that keeps them coming back for more.

Speak to your customers directly with Tabular's personalization options

At Tabular, we care about you and we know you care about your customers too. That's why we've made it easy to create personalized emails that make them feel valued and understood.

Here's how Tabular helps you speak directly to your customers:

  • Create email templates with text that dynamically adapts to each recipient. Use variables to easily insert personal information like their name, location, or past purchases.
  • Showcase related products using for-loop syntax. Recommend items based on their browsing history or past orders to increase engagement and drive sales.
  • Conditionally show or hide email blocks using if statements. Customize Tabular's email templates based on customer preferences or segments to deliver the most relevant content.

Everyone Can Create Emails with Tabular's Email Template Builder

  • User-friendly Interface: Tabular offers a clean and intuitive drag-and-drop interface that makes it easy for anyone to create professional-looking emails, regardless of their design experience.
  • Responsive Design Focus: With Tabular, you have complete control over how your emails render on different devices.
  • Pixel-Perfect Emails: Tabular generates optimized HTML code that renders correctly in over 50 email clients, including older versions of Outlook.
  • Efficient Workflow: You can use reusable building blocks and team collaboration options for a better the email creation process, saving your time and effort.
  • High-Quality HTML Email Templates: Tabular offers a curated selection of professionally designed email templates to get you started quickly.
  • Seamless Integrations: Tabular integrates with over 20 popular email service providers, allowing you to easily export and use your templates in your preferred platform.

Free, professionally designed, customizable email templates for your brand

Companies that create emails with Tabular don’t just send messages—they build lasting relationships that keep customers engaged. This includes leading brands and organizations such as UNIPAR (Universidade Paranaense), Braver, Kappa, BMW, Newsweek, Rollup, MINI, Latitud, Playbook, Hostelworld, Scalapay, and Securitas.

Companies using Tabular to create email templates including Braver, Kappa, BMW, Newsweek, Rollup, Mini, Latitud, Playbook, Scalapay, Securitas

Other email template builders vs Tabular: Pricing

Tabular.emailStripoBeefree
Free Plan
Free Plan Limits3 emails/month, 5 previews/day, 20GB CDN quota4 exports/month, 5 test emails/day, 10 stored emails, Unlimited image storage 16 exports/month, 10 designs, 20GB CDN quota 2
Paid PlansPlus (€29/month), Pro (€39/month), Organization (€99/month)Basic ($20/month or $16/month billed annually), Medium ($45/month or $36/month billed annually), Pro ($95/month or $76/month billed annually)Professional ($30/month), Business ($160/month), Enterprise (Custom)
Users IncludedPlus: 2, Pro: 3, Organization: 5Basic: 2, Medium: 3, Pro: 10Professional: 2, Business: 2, Enterprise: Custom
Email LimitsPlus: Unlimited emails, Pro: Unlimited emails, Organization: Unlimited emailsBasic: 50 emails, Medium: 300 emails, Pro: Unlimited emailsProfessional: Unlimited emails, Business: Unlimited emails, Enterprise: Unlimited emails
CDN QuotaPlus: 50GB, Pro: 250GB, Organization: 250GBUnlimitedProfessional: 250GB, Business: 1TB, Enterprise: 2TB+

Other email template builders vs Tabular: Features

Tabular.emailStripoBeefree
Drag-and-Drop Editor
Mobile Design Mode
Custom HTML/CSS
AMP for Email
Image Hosting
Integrations20+ ESPs80+ ESPs20+ ESPs and Custom Connector
Collaboration FeaturesTeamspaces, roles, permissionsUser roles, permissionsUser roles, permissions, commenting, approval workflow
AI FeaturesAI writing assistant for copy and subject linesAI writing assistant for copy, alt text, and images
Version History
Custom Fonts
Dynamic Content
Best forIntuitive user experience with a focus on responsive designVast template library and advanced customizationStrong collaboration features and landing page builder
Icon LibrariesFontAwesome, Feather Icons, HeroiconsLimited support with FontAwesomeCustom icon uploads

What is an HTML Email Template?

An "HTML email template" is a pre-designed layout used for marketing campaigns, newsletters, or transactional messages such as invoices and shipment notifications. These templates are carefully coded using specific HTML and CSS for proper display across various email clients.

With Tabular’s drag-and-drop email builder https://tabular.email, you can create professional HTML email templates in seconds, avoiding the hassle of writing extensive code and dealing with compatibility issues.

Simple HTML Email Template Example

<!--
* This email was built using Tabular.
* For more information, visit https://tabular.email
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" lang="en">
<head>
<title></title>
<meta charset="UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!--[if !mso]>-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->
<meta name="x-apple-disable-message-reformatting" content="" />
<meta content="target-densitydpi=device-dpi" name="viewport" />
<meta content="true" name="HandheldFriendly" />
<meta content="width=device-width" name="viewport" />
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no" />
<style type="text/css">
table {
border-collapse: separate;
table-layout: fixed;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt
}
table td {
border-collapse: collapse
}
.ExternalClass {
width: 100%
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%
}
body, a, li, p, h1, h2, h3 {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
html {
-webkit-text-size-adjust: none !important
}
body {
min-width: 100%;
Margin: 0px;
padding: 0px;
}
body, #innerTable {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
#innerTable img+div {
display: none;
display: none !important
}
img {
Margin: 0;
padding: 0;
-ms-interpolation-mode: bicubic
}
h1, h2, h3, p, a {
overflow-wrap: normal;
white-space: normal;
word-break: break-word
}
a {
text-decoration: none
}
h1, h2, h3, p {
min-width: 100%!important;
width: 100%!important;
max-width: 100%!important;
display: inline-block!important;
border: 0;
padding: 0;
margin: 0
}
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 + #body a {
color: inherit;
text-decoration: none;
font-size: inherit;
font-family: inherit;
font-weight: inherit;
line-height: inherit;
}
a[href^="mailto"],
a[href^="tel"],
a[href^="sms"] {
color: inherit;
text-decoration: none
}
</style>
<style type="text/css">
@media (min-width: 481px) {
.hd { display: none!important }
}
</style>
<style type="text/css">
@media (max-width: 480px) {
.hm { display: none!important }
}
</style>
<style type="text/css">
@media (max-width: 480px) {
.t108,.t109{display:block!important}.t6{line-height:34px!important;font-size:28px!important}.t108{text-align:left!important}.t107,.t73{vertical-align:top!important;display:inline-block!important;width:100%!important;max-width:800px!important}.t71{padding-bottom:15px!important;padding-right:0!important}.t105{padding-left:0!important}
}
</style>
<!--[if !mso]>-->
<link href="https://fonts.googleapis.com/css2?family=Albert+Sans:wght@400;500;600;700&amp;display=swap" rel="stylesheet" type="text/css" />
<!--<![endif]-->
<!--[if mso]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
</head>
<body id="body" class="t148" style="min-width:100%;Margin:0px;padding:0px;background-color:#FAF8F5;"><div class="t147" style="background-color:#FAF8F5;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" align="center"><tr><td class="t146" style="font-size:0;line-height:0;mso-line-height-rule:exactly;background-color:#FAF8F5;" valign="top" align="center">
<!--[if mso]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false">
<v:fill color="#FAF8F5"/>
</v:background>
<![endif]-->
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" align="center" id="innerTable"><tr><td align="center">
<table class="t145" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="600" class="t144" style="width:600px;">
<table class="t143" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t142" style="padding:40px 15px 40px 15px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="left">
<table class="t4" role="presentation" cellpadding="0" cellspacing="0" style="Margin-right:auto;"><tr><td width="40" class="t3" style="width:40px;">
<table class="t2" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t1"><div style="font-size:0px;"><img class="t0" style="display:block;border:0;height:auto;width:100%;Margin:0;max-width:100%;" width="40" height="40" alt="" src="https://51394469-9f14-4904-8a06-9e6cc6d4bfbc.b-cdn.net/e/cc72098e-0954-4404-be41-1295dc5974ae/c6d0b1fd-df5f-4abc-8c86-481cd84a262b.png"/></div></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t5" style="mso-line-height-rule:exactly;mso-line-height-alt:30px;line-height:30px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t10" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="570" class="t9" style="width:600px;">
<table class="t8" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t7"><h1 class="t6" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:39px;font-weight:600;font-style:normal;font-size:34px;text-decoration:none;text-transform:none;letter-spacing:-1.36px;direction:ltr;color:#0046FF;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">You transfered a payment of $9.99 USD to Pumpkin Services Inc.</h1></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t11" style="mso-line-height-rule:exactly;mso-line-height-alt:30px;line-height:30px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="left">
<table class="t16" role="presentation" cellpadding="0" cellspacing="0" style="Margin-right:auto;"><tr><td width="570" class="t15" style="width:600px;">
<table class="t14" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t13"><p class="t12" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:400;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#0E1E3B;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">It can take some time before this transaction is visible on your account. The amount will be deducted from your account in the coming 1-2 working days. Be sure to have sufficient credit in your account to prevent possible costs.</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t17" style="mso-line-height-rule:exactly;mso-line-height-alt:30px;line-height:30px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td><div class="t112" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t116" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="570" class="t115" style="width:600px;">
<table class="t114" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t113" style="overflow:hidden;background-color:#0044FF;padding:30px 35px 30px 35px;border-radius:12px 12px 12px 12px;"><div class="t111" style="width:100%;text-align:left;"><div class="t110" style="display:inline-block;"><table class="t109" role="presentation" cellpadding="0" cellspacing="0" align="left" valign="top">
<tr class="t108"><td></td><td class="t73" width="245" valign="top">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" class="t72" style="width:100%;"><tr><td class="t71" style="padding:0 5px 0 0;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t32" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t31" style="width:800px;">
<table class="t30" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t29"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t22" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t21" style="width:600px;">
<table class="t20" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t19"><p class="t18" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:600;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;letter-spacing:-0.64px;direction:ltr;color:#F7F7F7;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">Transaction ID</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t24" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t28" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t27" style="width:600px;">
<table class="t26" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t25"><p class="t23" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:500;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#F8F8F8;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">1JX12314128K723452D</p></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t50" style="mso-line-height-rule:exactly;mso-line-height-alt:15px;line-height:15px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t54" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t53" style="width:800px;">
<table class="t52" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t51"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t37" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t36" style="width:600px;">
<table class="t35" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t34"><p class="t33" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:600;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;letter-spacing:-0.64px;direction:ltr;color:#F7F7F7;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">Store</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t39" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t43" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t42" style="width:600px;">
<table class="t41" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t40"><p class="t38" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:500;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#F8F8F8;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">Pumpkin Services Inc.</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t45" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t49" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t48" style="width:600px;">
<table class="t47" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t46"><p class="t44" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:500;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#F8F8F8;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">https://pumpkin.com/bill</p></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t66" style="mso-line-height-rule:exactly;mso-line-height-alt:15px;line-height:15px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t70" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t69" style="width:800px;">
<table class="t68" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t67"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t59" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t58" style="width:600px;">
<table class="t57" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t56"><p class="t55" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:600;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;letter-spacing:-0.64px;direction:ltr;color:#F7F7F7;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">Invoice reference</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t61" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t65" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t64" style="width:600px;">
<table class="t63" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t62"><p class="t60" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:500;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#F8F8F8;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">MTVZ5V9JL7a0</p></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td><td class="t107" width="245" valign="top">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" class="t106" style="width:100%;"><tr><td class="t105" style="padding:0 0 0 5px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t88" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t87" style="width:800px;">
<table class="t86" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t85"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t78" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t77" style="width:600px;">
<table class="t76" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t75"><p class="t74" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:600;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;letter-spacing:-0.64px;direction:ltr;color:#F7F7F7;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">Transaction date</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t80" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t84" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t83" style="width:600px;">
<table class="t82" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t81"><p class="t79" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:500;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#F8F8F8;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">17 Oct. 2022 11:27:03</p></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t100" style="mso-line-height-rule:exactly;mso-line-height-alt:15px;line-height:15px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t104" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t103" style="width:800px;">
<table class="t102" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t101"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="width:100% !important;"><tr><td align="center">
<table class="t93" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t92" style="width:600px;">
<table class="t91" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t90"><p class="t89" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:600;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;letter-spacing:-0.64px;direction:ltr;color:#F7F7F7;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">Store notes</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t95" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t99" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="240.00000000000003" class="t98" style="width:600px;">
<table class="t97" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t96"><p class="t94" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:500;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#F8F8F8;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">You did not add any notes.</p></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td>
<td></td></tr>
</table></div></div></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t117" style="mso-line-height-rule:exactly;mso-line-height-alt:5px;line-height:5px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td><div class="t120" style="mso-line-height-rule:exactly;mso-line-height-alt:30px;line-height:30px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="left">
<table class="t124" role="presentation" cellpadding="0" cellspacing="0" style="Margin-right:auto;"><tr><td width="570" class="t123" style="width:600px;">
<table class="t122" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t121"><p class="t119" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:400;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#0E1E3B;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;"><span class="t118" style="margin:0;Margin:0;font-weight:bold;mso-line-height-rule:exactly;">Having trouble with this transaction?</span></p></td></tr></table>
</td></tr></table>
</td></tr><tr><td align="left">
<table class="t129" role="presentation" cellpadding="0" cellspacing="0" style="Margin-right:auto;"><tr><td width="570" class="t128" style="width:600px;">
<table class="t127" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t126"><p class="t125" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:400;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#0E1E3B;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;">It can take some time before this transaction is visible on your account. The amount will be deducted from your account in the coming 1-2 working days.</p></td></tr></table>
</td></tr></table>
</td></tr><tr><td align="left">
<table class="t135" role="presentation" cellpadding="0" cellspacing="0" style="Margin-right:auto;"><tr><td width="570" class="t134" style="width:600px;">
<table class="t133" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t132"><p class="t131" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:400;font-style:normal;font-size:15px;text-decoration:none;text-transform:none;direction:ltr;color:#0E1E3B;text-align:left;mso-line-height-rule:exactly;mso-text-raise:2px;"><a class="t130" href="https://tabular.email" style="margin:0;Margin:0;font-weight:700;font-style:normal;text-decoration:none;direction:ltr;color:#0046FF;mso-line-height-rule:exactly;" target="_blank">More information about Buyers Protection</a></p></td></tr></table>
</td></tr></table>
</td></tr><tr><td><div class="t137" style="mso-line-height-rule:exactly;mso-line-height-alt:30px;line-height:30px;font-size:1px;display:block;">&nbsp;&nbsp;</div></td></tr><tr><td align="center">
<table class="t141" role="presentation" cellpadding="0" cellspacing="0" style="Margin-left:auto;Margin-right:auto;"><tr><td width="570" class="t140" style="width:600px;">
<table class="t139" role="presentation" cellpadding="0" cellspacing="0" width="100%" style="width:100%;"><tr><td class="t138" style="border-top:1px solid #CFCFCF;padding:30px 0 0 0;"><p class="t136" style="margin:0;Margin:0;font-family:Albert Sans,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:22px;font-weight:400;font-style:normal;font-size:13px;text-decoration:none;text-transform:none;letter-spacing:-0.52px;direction:ltr;color:#0E1E3B;text-align:left;mso-line-height-rule:exactly;mso-text-raise:3px;">Payment Gateway Inc. © 2022</p></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table>
</td></tr></table>
</td></tr></table></td></tr></table></div><div class="gmail-fix" style="display: none; white-space: nowrap; font: 15px courier; line-height: 0;">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</div></body>
</html>

HTML Email Template Characteristics

  • Structure and Layout: Email templates typically use table-based layouts, which can be unfamiliar to developers accustomed to modern web design techniques.
  • Styling: HTML emails use CSS to control fonts, colors, spacing, and other visual elements. Inline styles are commonly applied for broader email client support, and it’s important to check which clients support specific features.
  • Responsiveness: HTML templates are designed to adapt to different screen sizes, ensuring readability on both mobile and desktop devices. Email responsiveness differs significantly from standard web design.
  • Dynamic Content: Placeholders and conditional logic allow templates to be personalized, such as including recipient names, order details, or product recommendations. Without these, html email templates cannot deliver their full potential.
  • Compatibility: HTML emails are built to render consistently across multiple email clients, including Gmail, Outlook, and Apple Mail.