Click any text to edit it right here · click an image or link to jump to its setting
- Replace the placeholder links: Header link, Button link, Unsubscribe link, Email preferences link.
Refer a Friend Email
Responsive · Dark mode
Newsletter Email
Responsive · Dark mode
Product Update Email
Responsive · Dark mode
Webinar Invitation Email
Responsive · Dark mode
Black Friday Sale Email
Responsive · Dark mode
Last Chance Sale Email
Responsive · Dark modeRefer a Friend Email — Patreon Responsive HTML Email Template
Marketing · v1.0.0 · Updated 2026-10-20 · Gmail, Outlook & Apple Mail · Dark mode
Refer a Friend 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 →What's included
Features
About this template
Refer a Friend Email — Free Referral Program Email Template
Refer a Friend Email is a free, responsive HTML template for promoting a referral programme. Referred customers tend to trust a brand faster and stay longer, because a friend vouched for it, which makes "give and get" programmes one of the most cost-effective ways to grow.
The double-sided offer, front and centre
A gift icon and a "Give $20, get $20" headline make the deal clear instantly. Two reward cards spell it out: what the friend gets and what the customer gets. Below, the customer's personal referral link sits in a copy-friendly box, with a big "Share your link" button and an optional tracker line ("You've referred 2 friends and earned $40") that rewards people who have already shared.
Simple steps and clear terms
A numbered "How it works" section explains the programme in three short steps, and a terms line covers the rules: minimum order, when credit is added and that credit can't be exchanged for cash. Clear terms build trust and prevent disputes later.
Works with any referral tool
Copy the HTML into Klaviyo, Mailchimp, HubSpot or Customer.io, and fill the referral link and tracker from a referral platform such as ReferralCandy, Friendbuy, Rewardful or your own system. Built with tables and inline styles, an Outlook-safe button, a dark palette and a plain-text version, and the footer has the unsubscribe link and postal address that marketing email needs. Send it after a happy moment, such as a delivered order or a 5-star Review Request, or a high NPS Survey score.
Extend with AI
Take This Email Further With AI
Give this prompt to an AI assistant to write your own version of the Refer a Friend 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:
Create a responsive HTML email: “Refer a Friend Email”, a marketing email.
Purpose: A referral programme email built around a "give and get" offer: two reward cards (what your friend gets, what you get), the customer's personal referral link in a copy-friendly box, three numbered steps, a "Share your link" button, a referral tracker line and the programme terms.
Inbox text:
- Subject line: “Give $20, get $20: share Acme with a friend”
- Preheader (hidden preview text): “Your friends get $20 off their first order, and you get $20 for every friend who buys.”
Content, top to bottom:
- Message & button
- Rewards
- How it works
Headline: “Give $20, get $20”. Main button: “Share your link”.
Lead with the offer in the first line, with one main button and one quiet secondary link.
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 #0f766e, 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 Refer a Friend Email Template
How it’s different
How It’s Different From Other Free Email Templates
Step by step
How to Use
- 1Pick 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.
- 2Edit the contentFill in the message & button, rewards and how it works, or click any text in the preview to jump to its field. Switch the how it works on or off.
- 3Add your brandUpload or paste your logo, set the brand colour and the light and dark palettes, pick fonts, or apply your saved brand kit.
- 4Preview and checkSwitch between desktop, mobile and dark mode, and fix anything the pre-send checks flag, such as placeholder links or missing alt text.
- 5Export or forkCopy the HTML into Mailchimp, Klaviyo, HubSpot, Brevo 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
Promote it
Social Post Templates to Match the Refer a Friend Email Email
An email works harder with a post behind it. Announce the refer a friend email campaign on social media with matching free templates in the same editor: Giveaway Contest. 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 clear double-sided offer, the customer's personal link, one button to share, short steps and simple terms. Sending it at a happy moment, such as after a delivery or a great review, makes a big difference.
After a customer has had a good experience, for example a few days after delivery, after a high NPS score or a positive review, or when they hit a milestone in your product.
Use your referral platform's merge variable in the link field and the button, for example a personalised URL from ReferralCandy, Friendbuy or Rewardful, or generate the link in your own code.
Yes. It promotes your business, so it is commercial email under US CAN-SPAM and needs an unsubscribe link and postal address. Both are in the footer.
Include a short summary, such as the minimum order and when rewards are added, and link to the full terms. Clear rules prevent disputes and build trust.
It saves an editable copy of your Refer a Friend 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.