Abandoned Cart Email for Coffee Brands

Coffee shoppers abandon carts over roast date doubt and grind size worry, not price. This Klaviyo-ready abandoned cart email reassures them on freshness, locks in subscribe-and-save, and ships within hours.

Open the full email ↗ Get this on your brand
Live preview View HTML ↗

What makes this abandoned cart work for coffee / tea

Coffee carts die for two reasons. The buyer is not sure their grind matches their brewer, or they wonder if the beans will sit in a warehouse and arrive stale. Price is rarely the blocker, so a flat 20 percent off underperforms. Sell what only a roaster can promise.

Trigger. Use Checkout Started in Klaviyo, filtered to carts containing coffee. Add a condition that excludes subscribers with an active subscription, since you do not want to discount a recurring order that is already locked in.

Timing. Send the first email at two hours. Coffee is a fresh product, and two hours is when the "did I pick the right grind" doubt peaks. Send the second at 24 hours. Hold the third back to 72 hours, and only then attach a discount or the subscribe-and-save offer.

Offer. Lead with subscribe-and-save (10 to 15 percent) rather than a one-time coupon. Recovered coffee carts that convert to subscription keep generating revenue for months, while a single coupon dies at first delivery.

Copy angle. Lead with the roast date. Name the day. Reassure on grind. This is the part that beats generic retail cart email.

Subject line that wins: "Your beans are roasted and waiting, {{ first_name|default:'friend' }}" Preheader: "We roast Tuesday and Friday. Order by 2pm and it ships the same day." Body line: "Your 12oz Ethiopia Yirgacheffe, whole bean, roasted {{ event.extra.roast_date|date:'M j' }}. Notes of blueberry, jasmine, brown sugar."

CTA. "Finish your order" beats "Complete your purchase" in coffee tests. It sounds like a human roaster finishing a bag, not a checkout page.

Numbers to expect. Coffee cart-recovery emails typically open at 42 to 55 percent and convert at 10 to 14 percent on first touch. When subscribe-and-save is the offer, 18 to 25 percent of recovered carts attach a subscription.

Why it renders in every inbox

This email is built as nested HTML tables, not divs or flexbox. Outlook, Gmail, and Yahoo all render table-based layout reliably. Div-based layout breaks in Outlook's Word rendering engine and in older Gmail clients.

Inline CSS. Every style lives on the element. Gmail strips the head style block for non-Gmail senders and many inboxes ignore classes, so inline is the only safe path. MJML compiles to inline CSS automatically.

Bulletproof VML button. Outlook 2007 through 2019 use Word to render HTML, and Word does not support CSS padding or border-radius on links. The button is wrapped in VML (v:rect and v:textbox) so it draws as a solid colored rectangle with the label centered, clickable on the whole surface in Outlook.

Live text. Headlines, body copy, and the price are real text, not images. Images get blocked by default in many clients. Live text also lets screen readers read the offer and lets the buyer copy the roast date.

Dark mode. A meta name="color-scheme" content="light dark" tag in the head tells Apple Mail and Outlook to respect a dark theme. We avoid hard-coded white backgrounds behind body text so inverted text stays readable when the inbox flips dark.

One mobile media query. A single @media (max-width: 480px) rule stacks the hero, drops padding to 16px, and forces images to 100 percent width. One query is enough and keeps the head clean.

Web-font fallbacks. The font stack is -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif. No hosted web font is loaded over a network request, so there is no flash of unstyled text and no broken glyphs in Outlook.

How to use it in Klaviyo or Mailchimp

Copy the HTML. Grab the MJML below, run it through the MJML compiler at mjml.io or the MJML CLI, and copy the compiled HTML.

Paste into Klaviyo. Create an email inside your Abandoned Cart flow. Drag an HTML block into the canvas, click it, and paste the HTML. The drag-and-drop text block will not preserve the tables, so use the HTML block.

Paste into Mailchimp. In a Mailchimp automation email, choose Code Your Own, then Paste in code, and paste the HTML.

Swap brand, colors, and links. Replace the logo image URL, the hero image URL, and the checkout link with your store's. Swap the three hex colors: the dark brown header, the coffee-red CTA, and the cream background. Match them to your roastery's palette.

Wire merge tags.

Klaviyo tags for a coffee cart: - First name: {{ first_name|default:'friend' }} - Cart item name: {{ event.extra.line_items.0.product.name }} - Price: {{ event.extra.line_items.0.price }} - Roast date (custom event property): {{ event.extra.roast_date|date:'M j' }} - Checkout URL: {{ event.extra.checkout_url }}

Mailchimp tags: - First name: *|FNAME|* - Cart URL: *|CART:URL|* - Product name inside a Product block: *|PRODUCT:title|*

Test before you send. Send a preview to Gmail (web and Android), Apple Mail on iPhone, and Outlook 2016 or newer. Toggle dark mode on iPhone and confirm the cream background and dark text invert cleanly. Confirm the VML button draws as a solid colored rectangle in Outlook, not a plain underlined link.

Questions

Is this abandoned cart email free to use for my coffee brand? +

Yes. Copy the MJML, compile it, and paste the HTML into Klaviyo or Mailchimp. No license, no attribution, no cost. Use it across every roastery client you run.

Will this email render in Outlook for my coffee subscribers? +

Yes. Outlook 2007 through 2019 render the button as a solid colored rectangle because it is built with VML. The layout uses nested tables and inline CSS, which is the only layout Outlook's Word engine draws correctly.

How do I match the email to my roastery's brand colors? +

Swap three hex values in the MJML head. Change the dark header color, the CTA button color, and the cream background. The MJML keeps all colors in mj-attributes at the top, so you edit them in one place and every block updates when you recompile.

Do I need to know HTML to use this template? +

No. Paste the compiled HTML into an HTML block, then swap the text inside each block and the image URLs. Leave the table structure alone. To rebrand the colors, edit the three hex values in the MJML head and recompile.

Want this on your client's brand?

Paste a client's site and we build a real, on-brand sample in clean, ESP-safe HTML you can paste into Klaviyo.

Get a free sample

More templates