Supported by

If you’re tired of designing something beautiful in Figma and then wasting hours recreating it in code or wrestling with MJML (and honestly, who isn’t?), this integration is going to save you serious time.

Let me show you how you can design beautiful emails in Figma and export them directly to Loops as production-ready MJML—all in just a few clicks.

What You’ll Need Before We Start

Before we jump in, make sure you have:

• A Figma account with the Email Love plugin installed
• A Loops account
• A designed email ready to export in Figma

Got all that? Perfect. Let’s get started.

Step 1: Design Your Email in Figma

Start with your email design in Figma. Include all your content, links, images, and branding. The Email Love plugin gives you 40+ pre-built components that are already optimized for email, so you’re not starting from scratch every time.

The beauty here is that you’re working in a proper design tool—one you already know and love—instead of wrestling with email builder constraints or trying to visualize code in your head.

Step 2: Preview Before You Export

Here’s where things get smart. Before you export anything, preview your email directly in the plugin:

• Desktop view – Make sure your layout looks great on larger screens
• Mobile view – Check that everything stacks properly and CTAs are thumb-friendly
• Dark mode – Verify your colors don’t disappear when users have dark mode enabled
• Light mode – Ensure readability in standard viewing mode

This preview functionality means you catch issues before they hit your ESP, not after. Trust me, finding a broken mobile layout at this stage is way better than discovering it in your inbox after you’ve already sent to 10,000 people.

Step 3: Export to Loops

Click the Export button at the top of the plugin and select Loops from the dropdown.

Here’s what makes the Loops integration special: instead of using an API connection like our other integrations, we export a zip file containing:

• MJML code – Since Email Love uses MJML natively, your export is clean and framework-ready
• All images – Hosted and optimized, ready to render
• Unsubscribe links – Automatically merged into Email Love footers (one less thing to remember)

Click Export to Loops and the zip file downloads to your computer. Easy.

Step 4: Import Into Loops

Now let’s hop over to your Loops account:

1. Create a new manually sent campaign
2. Instead of using the built-in email editor, select the code editor option
3. Upload the zip file you just exported from Figma
4. That’s it—your email imports with perfect fidelity

Your email appears in Loops exactly as you designed it in Figma. No surprises, no reformatting, no “why does this button look weird now?” moments.

Step 5: Finalize and Send

From here, it’s standard Loops workflow:

• Select your audience
• Schedule your send time
• Preview one more time (you can see it directly in Loops)
• Hit send

The entire process—from Figma to Loops to scheduled campaign—takes about 3 minutes once you’ve done it once or twice.

Why This Integration Matters

Look, I’ve been in email marketing for over 15 years, and I can’t tell you how many hours I’ve watched teams waste recreating designs or hand-coding emails from scratch. This integration eliminates that friction entirely.

But it’s not just about saving time (though our customers report cutting their email production time by about 50%). This approach gives you something even more valuable: freedom.

When you design and store your email templates in Figma, you’re not locking all your content into your ESP. Think about it—if you ever need to migrate from Loops to another platform, or if you want to use the same design across multiple ESPs, you’re not stuck. Your source of truth lives in Figma, where you can easily edit and export it again to wherever you need it.

I’ve seen too many teams get trapped by proprietary builders. Sure, they’re convenient at first, but try moving 50+ email templates to a new platform when your company gets acquired or your pricing changes. Not fun.

With this workflow:

• Your designers work in the tool they love (Figma)
• Your developers get clean, responsive MJML
• Your email marketers can focus on strategy instead of fighting with code
• You maintain complete ownership and portability of your email designs

Everyone wins, and you’re never locked in.

Pro Tips for Success

Name your Figma frames thoughtfully – Whatever you call your frame becomes easier to track, so “Welcome Email – Version 2” is much more helpful than “Frame 47.”

Use Email Love footers – The unsubscribe merge happens automatically when you’re using one of our pre-built footer components. Makes compliance brain-dead simple.

Preview in Loops too – While our plugin generates solid, tested MJML, always preview in Loops before sending to make sure everything looks perfect with your actual data merged in.

Batch your exports – If you’re redesigning multiple emails, knock them all out in Figma first, then export them all at once. Get into a rhythm.

What’s Next?

This integration is just one way we’re working to streamline email production workflows. The Email Love Figma plugin includes 40+ pre-built email components, image hosting, test email functionality, and integrations with other major ESPs too.

If you’re not already using the plugin, you can start with our free trial and see how it fits into your workflow.

The Starter plan is $19/user/month and includes:

• 10 HTML exports per month
• 40+ email components
• Image hosting
• Test email functionality
• All ESP integrations (including Loops)

Need unlimited exports? The Growth plan at $35/user/month has you covered.

Need Help?

We’ve got loads of Loops customers using this integration successfully, so if you run into any issues or have questions about setting this up for your team, just reach out. I’m always happy to help troubleshoot or walk through the setup on a quick call.

The goal here is to make email production faster and more enjoyable for everyone involved—because when the tools work smoothly, you can focus on creating emails that actually move the needle for your business.

Want more email marketing tips and tools? Subscribe to our newsletter for weekly insights from the Email Love team, or check out our collection of 200,000+ curated email examples for your next campaign inspiration.

Much love,
Andy

Email: [email protected]
Twitter: @emaillove