Abandoned Cart Email

Click any text to edit it right here · click an image or link to jump to its setting

  • Replace the placeholder links: Header link, Cart link, Item 1 image, Item 2 image, Unsubscribe link, Email preferences link.

Related Email Templates

9 in E-commerce categoryView all →
1–6 of 9
Patreon
E-commerce

Abandoned Cart Email

Responsive · Dark mode
Patreon
E-commerce

Back in Stock Email

Responsive · Dark mode
E-commerce

Order Confirmation Email

Responsive · Dark mode
E-commerce

Order Cancellation Email

Responsive · Dark mode
E-commerce

Shipping Confirmation Email

Responsive · Dark mode
E-commerce

Order Delivered Email

Responsive · Dark mode

Abandoned Cart Email — Patreon Responsive HTML Email Template

E-commerce · v1.0.0 · Updated 2026-10-19 · Gmail, Outlook & Apple Mail · Dark mode

Patreon

Abandoned Cart Email is a Patreon supporter template. Preview it and edit everything for free. Exporting it (HTML, ZIP and the other formats) and forking it to My Code need the supporter passcode, posted for patrons on Patreon. Supporters ($5 a month) also get a site with no ads.

Get the passcode on Patreon →
CategoryE-commerce
Tagsabandoned cartcart recoveryecommerceshopifystorediscount codedark mode
Updated October 16, 2026

What's included

Features

Up to three cart items with product photo, details and price
Bulletproof "Return to your cart" button that works in Outlook
Optional discount code in a dashed coupon box with an expiry note
Three reassurance points: shipping, returns and secure checkout
Personalised headline with a first-name merge tag
Responsive layout: full-width button and tidy rows on phones
Light and dark palettes, both editable
Unsubscribe link and postal address for CAN-SPAM
Plain-text version generated automatically
Upload product photos or paste your store image URLs

About this template

Abandoned Cart Email — Free HTML Cart Recovery Email Template

Abandoned Cart Email template: A cart recovery email for online stores: a friendly "you left something behind" headline, up to three cart items with photos and prices, a bold return-to-cart button, an optional discount code, free-shipping and returns reassurance and a help line.

Abandoned Cart Email is a free, responsive HTML template for winning back shoppers who added products to their cart and left without paying. Around seven in ten online carts are abandoned, and a well-timed reminder is one of the highest-earning emails an online store can send, often recovering a meaningful share of those sales automatically.

What's in the email

A friendly "you left something behind" headline with the shopper's first name, a short reassuring intro, up to three cart items with product photos, details and prices, and a bold "Return to your cart" button. Below it you can add a discount code in a dashed coupon box, three reassurance points such as free shipping, free returns and secure checkout, and a help line that invites a reply.

Built for real inboxes

The layout uses nested tables and inline styles, so product rows, photos and prices line up in Gmail, Apple Mail and Outlook on Windows. The button is a "bulletproof" VML button for Outlook and a styled link everywhere else, and it stretches to full width on phones, where most cart reminders are opened. A dark palette, a hidden preheader and a plain-text version are included.

Use it with any store

Copy the HTML into Shopify Email, Klaviyo, Omnisend, Mailchimp or WooCommerce and replace the sample items with your platform's cart variables, or loop over the item row in your own code. Pick your platform under Merge tags and first names and the unsubscribe link convert automatically. Need the follow-up emails too? Pair it with the Order Confirmation and Shipping Confirmation templates.

Extend with AI

Take This Email Further With AI

Give this prompt to an AI assistant to write your own version of the Abandoned Cart Email email: draft ten subject lines and preheaders, adapt the copy for a customer segment, translate it, convert it to MJML or React Email, or write the plain-text version. Then paste the result back into the editor above to check it in desktop, mobile and dark mode.

Prompt to recreate it

Copy this into your AI assistant of choice to build the effect from scratch, or as a jumping-off point for your own variant:

text
Create a responsive HTML email: “Abandoned Cart Email”, an e-commerce email.

Purpose: A cart recovery email for online stores: a friendly "you left something behind" headline, up to three cart items with photos and prices, a bold return-to-cart button, an optional discount code, free-shipping and returns reassurance and a help line.

Inbox text:
- Subject line: “You left something in your cart”
- Preheader (hidden preview text): “Your items are still waiting, and they’re selling fast. Here’s 10% off to help you decide.”

Content, top to bottom:
- Message & button
- Cart items (leave a name empty to hide it)
- Discount offer
- Reassurance

Headline: “You left something behind, {{first_name}}”. Main button: “Return to your cart”.
Show products with an image, name and price in a grid that stacks on mobile, and make the button the most visible element.

Build it like a professional email developer:
- Table-based layout, 600px wide on desktop and fluid on mobile (width 100%, max-width 600px).
- Inline CSS on every element, with one small style block only for media queries and dark mode (prefers-color-scheme).
- A bulletproof, Outlook-safe call-to-action button (padded table cell with a VML fallback), never an image.
- Colours: brand and button #ea580c, button text #ffffff, page background #eef0f7. Web-safe font stack with a fallback after the brand font.
- Every image has alt text and explicit width and height. Use PNG icons, never SVG, because Gmail and Outlook drop them.
- Hidden preheader text, a plain-text version, and a legal footer with the postal address, the reason the person is receiving it and a working unsubscribe link.

Finish with a short checklist of what to test in Gmail, Outlook for Windows, Apple Mail, mobile and dark mode.

Want to tighten it up first? Run this prompt through the AI Prompt Studio to score it across 8 quality dimensions, catch anti-patterns, and tune the wording for Claude, ChatGPT, or Gemini before you paste it in.

Why use it

Why Use the Abandoned Cart Email Template

💸
Recover lost sales
Most shoppers who abandon a cart were interested. A reminder with their actual items brings a share of them back without any extra ad spend.
🛒
Shows exactly what they left
Product photos and prices remind people why they wanted the item in the first place, which works far better than a generic "come back" message.
⚙
Coded for every inbox
Tables, inline styles and an Outlook-safe button keep the product rows and the call to action intact in Gmail, Apple Mail and Outlook.

How it’s different

How It’s Different From Other Free Email Templates

</>
Real email HTML you own
Not a locked design inside a sending platform. Copy production-ready HTML, download a .html file or fork it into My Code, and use it with any email service or your own code.
⚙
Coded for real inboxes
Tables, inline styles, Outlook conditional comments, a VML button and Outlook font fixes. Many free templates only look right in a browser.
◐
Dark mode built in
Separate, editable light and dark palettes, with a dark preview, instead of leaving dark mode to each email client.
✓
Checks before you send
Warnings for Gmail clipping, missing alt text, placeholder links, images that aren't hosted online, and a missing unsubscribe link or postal address.
Plain-text version included
A matching plain-text version is generated as you edit, ready for multipart emails and the clients and filters that read text.
◍
Free and private
No account, no watermark and no limits. Everything runs in your browser, and your edits are saved locally for next time.

Step by step

How to Use

  1. 1
    Pick your email platformChoose Mailchimp, Klaviyo, HubSpot or Brevo under Merge tags so first names and unsubscribe links export in its syntax, or keep plain {{first_name}} tokens.
  2. 2
    Edit the contentFill in the message & button, cart items, discount offer and reassurance, or click any text in the preview to jump to its field. Switch the discount offer and reassurance on or off.
  3. 3
    Add your brandUpload or paste your logo and images, set the brand colour and the light and dark palettes, pick fonts, or apply your saved brand kit.
  4. 4
    Preview and checkSwitch between desktop, mobile and dark mode, and fix anything the pre-send checks flag, such as placeholder links or missing alt text.
  5. 5
    Export or forkCopy the HTML into Shopify, Klaviyo, Omnisend, Postmark or your own code, copy the plain-text version, download a ZIP with images, or fork it into My Code.

Real-world uses

Common Use Cases

⏱
First reminder after one hour
Send the template without the discount about an hour after checkout is abandoned, so the reminder arrives while the shopper still remembers browsing your store.
🏷
Second email with a discount
Switch on the discount box for a follow-up the next day, with a code such as COMEBACK10 that expires in 48 hours to give hesitant shoppers a nudge.
🎁
Holiday season cart reminders
During Black Friday and December, change the intro to mention low stock and shipping cut-offs, since shoppers compare stores and leave carts more often then.
📦
Browse abandonment emails
Reuse the layout for shoppers who viewed products without adding them to the cart: change the headline to "Still thinking about these?" and link to the product pages.

Promote it

Social Post Templates to Match the Abandoned Cart Email Email

An email works harder with a post behind it. Announce the abandoned cart email campaign on social media with matching free templates in the same editor: Discount Badge. Use the same brand colours and fonts, export the post as an image at the right size for each network, and link to the same offer or page.

Got questions?

Frequently Asked Questions

A common sequence is three emails: the first about one hour after the cart is abandoned, a second around 24 hours later, and a third after 48 to 72 hours. Many stores add a discount only in the second or third email so they don't train shoppers to abandon carts on purpose.

Not always. The first reminder often works without one. Use the optional discount box in a later email, keep the code short-lived, and test whether the extra sales are worth the margin you give away.

Edit the template, open the Export menu and copy the HTML. In Klaviyo, create an HTML template and use it in your abandoned cart flow, replacing the sample items with the event's product variables. In Shopify, paste it into the abandoned checkout notification and swap the items for Liquid variables.

Yes. Cart reminders promote a purchase, so they are treated as commercial email under US CAN-SPAM and need a working unsubscribe link and your postal address. Both are already in the footer.

The editor shows up to three, which covers most carts. To list every item, fork the template to My Code or copy the HTML and repeat the product row inside your platform's loop.

It saves an editable copy of your Abandoned Cart Email in My Code, the UI Snippets code editor: the email markup goes in the HTML panel and its CSS (mobile and dark-mode rules plus fonts) in the CSS panel, so you can keep refining the code and save your own versions.

It is a Patreon template. Anyone can preview and edit it for free. Exporting and forking it are for Patreon supporters ($5 a month), who enter the supporter passcode once; designs you make with it can then be used in personal and commercial work. Everything runs in your browser, and your edits are saved locally.

Design your website