Help Center
How can we help? πŸ‘‹

Export your email to Parcel

How to export your Figma email design as a Parcel-ready HTML download using the Email Love plugin

The Email Love Figma Plugin exports your email designs in Parcel's native component format β€” <x-base>, <x-section>, <x-row>, <x-column> β€” so you can drop them straight into Parcel's editor and continue iterating in code. Unlike most ESP integrations, Parcel works as a download: pick Parcel from the export dropdown, click Export, and the plugin gives you a zip file you can import into your Parcel project.

Prerequisites

Before you begin, make sure you have:

  • The Email Love Figma plugin installed
  • At least one email designed in Figma using the plugin
  • An Email Love Footer with an Unsubscribe link in your design (recommended)

There's no API key, no Master Secret, no login flow β€” Parcel is a download destination, not a direct API push. See the Parcel sharing & playground docs for background on how Parcel handles imports.

Step 1: Open the Export Panel

  1. Select the email frame you want to export in Figma
  1. Click the Export button in the top right of the plugin
  1. Pick Parcel from the export dropdown β€” you can also start typing "parcel" to filter the list

The dropdown is alphabetised, so Parcel sits in the P section of the A–Z list of ESPs underneath the HTML, MJML, and Composa options.

Step 2: Export Your Email

  1. With Parcel selected, click Export
  1. The plugin sends your design to the Email Love backend, which converts it to Parcel's native component format (<x-base> / <x-section> / <x-row> / <x-column>)
  1. Your browser downloads a zip file containing the Parcel-ready HTML and any image assets

There's no API call to Parcel β€” the export ends with the download. You'll bring the file into Parcel in the next step.

Step 3: Import the File Into Parcel

  1. Unzip the download β€” you'll see a .html file and (if image hosting wasn't used) a folder of images
  1. Open Parcel and create or open the project you want to drop this email into
  1. Create a new template (or open an existing one you want to replace) and paste the contents of the .html file into the Parcel editor
  1. Save β€” your email is now editable in Parcel using its native component syntax

If images came down as separate files, upload them to your usual image host (or the Parcel asset workflow your team uses) and update the src URLs in the HTML to match.

Why download instead of direct API push?

Parcel's primary sharing methods (parcel.openInPlayground, parcel.embed) rely on browser cross-origin handoff β€” form POST and postMessage respectively. Figma plugins run inside a sandboxed iframe where those handoffs are unreliable, so we settled on a zip download as the cleanest, most reliable UX. You get the exact same Parcel-native output, you just bring it into Parcel yourself.

What the Plugin Does for You

  • Generates Parcel-native HTML with <x-base>, <x-section>, <x-row>, and <x-column> components so your email is immediately editable in Parcel's component system
  • Hosts your images (when image hosting is enabled in the export settings) so the HTML references CDN URLs that work as soon as you paste into Parcel β€” no manual upload needed
  • Preserves your unsubscribe link β€” the Email Love Footer's unsubscribe link is kept intact so the downstream ESP you send through can wire it up
  • Generates responsive, deliverable HTML that renders consistently across major email clients once Parcel re-exports the email for sending

Troubleshooting

Nothing downloads when I click Export: Check your browser's download permissions for emaillove.com β€” the export ends with a browser download, so a popup blocker or download prompt may be holding it up. Try Export again from a fresh tab if needed.

Images aren't loading after I paste the HTML into Parcel: If you exported with image hosting off, the zip includes a separate images folder and the HTML references local file paths that won't work once pasted into Parcel. Either re-export with image hosting on, or upload the images to your own host and update the src URLs in the HTML before saving in Parcel.

Parcel doesn't recognise the components after I paste: Make sure you're pasting into Parcel's code view, not the visual editor's plain-HTML mode. Parcel's <x-*> components only render correctly when pasted into a Parcel-aware editor.

The exported HTML looks plain (no <x-row> / <x-column>): Double-check that you selected Parcel in the export dropdown β€” not generic HTML or MJML. The Parcel-native output only happens when Parcel::Html is the chosen export.

Unsubscribe link not working: Make sure your design includes an Email Love Footer with an Unsubscribe link. Without one, there's nothing for the downstream ESP to swap a real unsubscribe URL into when you eventually send through Parcel.

Need help? Join our Discord community or reach out to our support team at hello@emaillove.com for assistance.

Related Articles

  • Export Overview β€” Understand all export options and how the plugin converts your Figma design to HTML
  • Image Hosting β€” How the plugin handles image hosting during export
Did this answer your question?
😞
😐
🀩