Skip to main content
Export turns the selected Email Love frame into production email code or sends it directly to your platform. This page covers the first-export flow. For the full destination list and feature comparison, see Export Overview.

Before you export

Finish these checks first:
  1. Run Copilot and fix structural errors.
  2. Open Preview and check desktop, mobile, fallback fonts, and dark mode.
  3. Verify the subject, preheader, links, alt text, merge tags, and unsubscribe link.
  4. Rename the top-level email frame with the template name you want to see in your ESP.
If Copilot reports a problem you cannot place, use the Claude or Codex preflight prompt for a read-only inspection of the Figma frame.

1. Select the whole email frame

Select the outer email frame on the Figma canvas. Do not select a Wrapper, Section, component, or text layer inside it. If the plugin says the selection is not a valid email template, return to the Layers panel and select the top-level frame that contains every section.

2. Open Export

Click Export in the plugin. The export screen shows the destinations available on your plan and lets you search the list.

3. Choose a destination

Pick the route that matches what happens next: See Export Overview for all supported destinations and the guide for each integration.

4. Connect the destination if needed

HTML and MJML downloads do not need an API connection. Direct integrations ask for the credentials required by that platform. Use credentials with only the permissions the integration needs. Never paste API keys into a Claude, Codex, support, or Discord message. Store them only in the plugin’s connection screen. When a destination supports Updatable Templates, turn it on if future exports should update the same remote template instead of creating duplicates.

5. Choose image handling

The standard export uploads Figma images to the Email Love CDN and inserts the hosted URLs into your email. You can also:
  • Connect your own S3, Cloudflare R2, Google Cloud Storage, or other supported provider
  • Export images in a ZIP when the destination requires a manual upload
  • Keep an external image URL for dynamic images such as countdown timers
See Image Hosting for storage setup, image formats, and troubleshooting.

6. Confirm the email details

Review the template name, subject, and preheader before the final export. The preheader should extend the subject, not repeat it. Destination-specific merge tags are applied during export. Check the final output in your ESP, especially unsubscribe, personalization, and dynamic-content tags.

7. Export

Click the final Export button. Depending on the destination, the plugin downloads a file, opens a browser download, calls the ESP API, or sends a webhook request. Do not close the plugin until it confirms the export completed or shows an error you can copy.

Test the result

An export is not the final test. Before scheduling the campaign:
  1. Open the template in your ESP and confirm the name and location.
  2. Send a test to a real inbox.
  3. Open it on desktop and mobile.
  4. Click every important link.
  5. Confirm images load and alt text is useful when they do not.
  6. Check merge tags, dynamic content, and unsubscribe behavior with test data.
  7. Use Litmus, Email on Acid, or InboxMonster for high-stakes cross-client testing.

Common problems

The plugin says to select an email template

Select the outer email frame, not a component inside it. If that frame still is not recognized, see Troubleshooting.

The API connection fails

Open the guide for your destination and confirm the key, region, account ID, and permission scopes. Redact credentials before sharing the error with support.

The export creates duplicates

Check whether the destination supports Updatable Templates. The update ID is stored on the Figma email frame, so exporting a copy of the frame may create a new remote template.

Images do not appear

Check the Image Hosting troubleshooting guide. If the ESP re-hosts images, inspect the final URLs inside the ESP as well.

The inbox version looks different from Figma

Small font and spacing differences are normal across email clients. Larger layout differences usually come from fixed-height text, column stacking, fallback fonts, or invalid structure. Compare Preview first, then use Get Help from Claude or Codex for a read-only diagnosis.