MJML Email Templates

Free, production-ready MJML & HTML email templates for SaaS, e-commerce and transactional flows.
Responsive · Outlook-safe · Works with any ESP

Browse templates · Generate with AI

About this repo

This repo contains battle-tested MJML email templates (+ compiled HTML) for common email flows:

✅ Welcome & onboarding ✅ Re-engagement & winback ✅ Product launches & promos ✅Invoices & receipts

✅ Password reset / security ✅ Abandoned cart recovery ✅ Shipping notifications ✅ Upsell & cross-sell

What you get

42+ free, production-ready MJML email templates
for SaaS onboarding, password reset, trial ending, invoices, shipping updates, abandoned cart recovery, winback, and promos.

Why use these?

• 📱 Mobile-first responsive
• 🎨 Clean, professional design
• ✉️ Tested on Gmail, Outlook, Apple Mail, Yahoo
• 🚀 Copy-paste ready HTML
• 🔓 MIT licensed (use commercially)
• 🔌 Works with any ESP (SendGrid, Resend, Postmark, etc.)

(back to top)

---

Quick Start

Option A : Use our pre-made templates

1. Browse the templates/{use-case}/ folders (welcome, password-reset, receipt-invoice, etc.)
2. Copy the MJML or the HTML code you need
3. Customize text, colors, and logo directly in the MJML
4. Use it in your email workflow ✅

Tip

All templates were generated with Mailteorite AI and are ready to use.
No installation required — just copy and customize!

---

Option B — Want to edit visually?

Don't want to edit code manually?

Use the free MJML live editor:

1. Go to mjml.io/try-it-live
2. Paste one of our MJML templates
3. Edit visually with live preview
4. Export HTML when done

---

Tip

Instead of editing templates manually, let Mailteorite generate exactly what you need.

(back to top)

Templates

👋 Welcome & Onboarding — templates/welcome/

Template	Use Case
01-welcome-classic.mjml	Clean welcome with single CTA
02-welcome-tutorial.mjml	Step-by-step onboarding guide
03-welcome-benefits.mjml	Value props + social proof

When to send: Immediately after signup, account creation, or first purchase

🔒 Password Reset & Security — templates/password-reset/

Template	Use Case
01-password-reset-simple.mjml	Basic reset with button
02-password-reset-security.mjml	Enhanced security warnings
03-password-changed.mjml	Confirmation after password change

When to send: Password reset requests, security alerts, account changes

🧾 Receipts & Invoices — templates/receipt-invoice/

Template	Use Case
01-receipt-simple.mjml	Basic order confirmation
02-receipt-detailed.mjml	Itemized with subtotals
03-invoice-business.mjml	B2B with VAT, payment terms

When to send: After purchase, subscription billing, refund confirmations

🚀 Product Launch & Promotions — templates/product-launch/

Template	Use Case
01-product-launch-hero.mjml	Big announcement with hero image
02-promo-discount.mjml	Discount codes & offers
03-flash-sale.mjml	Time-sensitive urgency

When to send: New features, seasonal sales, limited-time offers

🛒 Abandoned Cart Recovery — templates/abandoned-cart/

Template	Use Case	Timing
01-cart-reminder.mjml	Gentle reminder	~1 hour
02-cart-incentive.mjml	Discount offer	~24 hours
03-cart-final-chance.mjml	Last attempt	~48 hours

Strategy: Start soft, add incentive on 2nd email, create urgency on 3rd

🔄 Re-engagement & Winback — templates/reengagement/

Template	Use Case	Inactivity
01-reengagement-soft.mjml	"We miss you"	30 days
02-winback-offer.mjml	Exclusive comeback offer	60 days
03-final-goodbye.mjml	Account deletion warning	90 days

Strategy: Acknowledge absence, show what's new, give reason to return

📦 Shipping & Tracking — templates/shipping-update/

Template	Use Case
01-shipped-confirmation.mjml	Order shipped with tracking
02-out-for-delivery.mjml	Same-day delivery alert
03-delivered.mjml	Delivery confirmation + review request

When to send: Order shipped, out for delivery, delivered, delays

💰 Upsell & Cross-sell — templates/upsell/

Template	Use Case
01-upsell-premium.mjml	Free → Pro upgrade
02-cross-sell-related.mjml	"You might also like..."
03-post-purchase.mjml	"Complete the set"

When to send: 24-48h after purchase, trial ending, feature usage milestones

Note

Every .mjml file includes header comments explaining:

• When to send it
• Why it converts
• What to personalize

(back to top)

---

Integration Examples

These templates work with any ESP that accepts custom HTML:

Example : Resend

import { Resend } from "resend";
import fs from "fs";

const resend = new Resend("YOUR_API_KEY");
const html = fs.readFileSync("./dist/welcome-classic.html", "utf8");

await resend.emails.send({
  from: "hello@yourdomain.com",
  to: "user@example.com",
  subject: "Welcome 👋",
  html,
});

SendGrid, Postmark, Mailchimp, etc.

Just paste the HTML from templates/{usecases} into your platform's custom HTML editor.

Compatible with:
Resend · Postmark · SendGrid · AWS SES · Mailchimp · Klaviyo · Brevo · ActiveCampaign · Beehiiv · HubSpot · Campaign Monitor · Mailgun · and more

Note

We don't add tracking pixels, analytics scripts, or hidden junk.
You fully own the HTML.

(back to top)

---

Customization Tips

Quick Branding Checklist

• Update logo URL in <mj-image src="..." />
• Change primary color in <mj-button background-color="..." />
• Update company name in text
• Replace CTA links with your URLs
• Update footer (unsubscribe, privacy policy, social links)
• Test in Gmail, Outlook, and Apple Mail

Tip

Change only colors/text/logos first. Layout comes last.
Less chance to break Outlook compatibility.

(back to top)

---

FAQ

Is this free for commercial use?

Yes. MIT License.

You can use these in production, for clients, in your SaaS, white-labeled.
You do not have to credit us in emails you send.

[!WARNING] If you redistribute the source templates (MJML files), keep the MIT license notice in your repo.

Do these work in Outlook?

Yes. The compiled HTML uses table-based layouts and inline styles that render correctly in Outlook's Word-based renderer.

Tested on: Outlook 2016, 2019, 2021, 365 (Windows & Mac).

Are these mobile-responsive?

Yes. All templates are mobile-first:

• Buttons are finger-sized (44px+)
• Text is readable (14px+)
• Layouts stack on small screens
• Tested on iOS Mail, Gmail app, Samsung Email

Do I need to know MJML?

Not really. MJML is just readable markup that compiles to HTML.

You write:

<mj-button href="https://app.com">Click me</mj-button>

MJML generates bulletproof HTML tables that work everywhere.

If you don't want to install anything, use the free MJML live editor.

Can I request a template you don't have?

Yes! Open an Issue or Discussion.

Examples:

• "I need a trial expiring soon email"
• "I need a failed payment / dunning email"
• "I need an OTP code email"

We prioritize based on demand.

What is Mailteorite?

Mailteorite is an AI email generator.

You give it:

• A short prompt ("Create a welcome email")
• Your website URL

It:

• Extracts your brand (logo, colors, tone)
• Writes the copy
• Builds the MJML
• Exports clean HTML you can paste anywhere

If you don't want to hand-edit MJML, try it: mailteorite.com/features/mjml-email-templates

(back to top)

---

Contributing

We accept:

• ✅ New templates
• ✅ Bug fixes (typos, spacing, colors)
• ✅ Better defaults
• ✅ Accessibility improvements

How to Add a Template

# 1. Fork & clone
git clone https://github.com/YOUR_USERNAME/mjml-email-templates.git
cd mjml-email-templates

# 2. Create a branch
git checkout -b feat/new-template-name

# 3. Add your .mjml file in the right folder
# Example: templates/abandoned-cart/04-checkout-reminder.mjml

# 4. Test compile
mjml templates/abandoned-cart/04-checkout-reminder.mjml -o dist/checkout-reminder.html

# 5. Commit + push + open PR
git add .
git commit -m "feat: add checkout reminder abandoned cart email"
git push origin feat/new-template-name

Please include in your PR:

• When to send it
• Why it converts
• Screenshot (if possible)

We'll review and merge! 🙌

(back to top)

---

License

MIT License © 2025 Mailteorite

✅ Commercial use allowed
✅ Modification allowed
✅ Distribution allowed
✅ Private use allowed

Warning

You are responsible for:

• Legal compliance (GDPR, CAN-SPAM, unsubscribe links)
• Deliverability / spam score
• Legal/billing text accuracy
• Testing before production

We provide structure, not legal advice.

Full text: see LICENSE

(back to top)

---

_{⭐ Star this repo if it helped you ship emails faster}

Website · Twitter · Issues · Discussions

(back to top)