Help Center
How can we help? πŸ‘‹

Upload your email to Postmark

How to push your Figma email design directly into Postmark's template library with the Email Love plugin

The Email Love Figma Plugin pushes your email designs straight into Postmark's template library β€” no copy-paste required. Save your Postmark Server Token once, click Export, and the template (with images, inline CSS, plain-text version, and unsubscribe handling) shows up in Postmark, ready to send.

Prerequisites

Before you begin, make sure you have:

  • An active Postmark account with at least one server set up
  • 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 (required for export)

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 Postmark from the export dropdown

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

Step 2: Connect Your Postmark Server

The first time you export to Postmark you'll see the API key form. Fill in:

  1. Server Token β€” from your Postmark server's API Tokens tab. Each server has its own token, so make sure you grab the one for the server you want templates to land in.
  1. Connection Name β€” a friendly name for these credentials (e.g. "Marketing β€” Production"). You can save multiple Postmark connections and switch between them.
  1. Click Save Credentials

Your Server Token is encrypted and stored in the plugin so you only have to enter it once per connection. To swap to a different Postmark server later, click Change credentials in the same panel.

Step 3: Export Your Email

  1. With Postmark selected and your credentials loaded, click Export
  1. The plugin sends your HTML to the Email Love backend, which calls Postmark's POST /templates API with your X-Postmark-Server-Token header
  1. On success you get a confirmation toast β€” your template is now live in Postmark

The template's alias in Postmark is taken from your Figma frame name, so rename the frame before exporting if you want it to show up with a specific name.

Step 4: Use Your Template in Postmark

  1. Log into Postmark and open the server you exported to
  1. Navigate to Templates
  1. Find the template you just exported (it'll be at the top of the list, named after your Figma frame)
  1. Use it from your application via Postmark's /email/withTemplate API, or send a test from the Postmark UI

Standalone HTML Mode (no shared layout)

Email Love templates are exported in standalone HTML mode β€” each one ships with its own complete <head>, CSS, and body, and is created in Postmark with LayoutTemplate: "". That means:

  • Your template does not use Postmark's shared layout system. There's no parent layout wrapping your HTML.
  • The CSS and structure built in Figma render exactly as designed, with no risk of conflict with another layout's styles.
  • If you currently rely on a Postmark layout for headers, footers, or boilerplate styling, design those into your Figma frame instead β€” each export is fully self-contained.

What the Plugin Does for You

  • Pushes the template to Postmark via the Templates API with your Server Token
  • Generates a plain-text version automatically from your HTML so Postmark has both HtmlBody and TextBody
  • Includes the subject line if you've set one in the export panel
  • Handles unsubscribe links β€” the Email Love Footer's unsubscribe link is converted to Postmark's {{{ pm:unsubscribe }}} / {{unsubscribe_url}} tag automatically
  • Inline CSS friendly β€” Postmark auto-inlines CSS at delivery time, so styles render correctly across all major email clients
  • Hosts your images so they render reliably in the inbox

Editing Your Template in Postmark

You can edit the template HTML directly in Postmark's template editor, but for ongoing changes we recommend editing in Figma and re-exporting so your Figma file stays the single source of truth. Re-exporting with the same frame name will create a new template; if you want to keep the same template alias in Postmark, rename or archive the old one first to avoid confusion.

Troubleshooting

"Invalid Server Token" / 401 errors: Double-check the Server Token is from the API Tokens tab of the right Postmark server (not your Account API token, which is different and won't work). Re-open Change credentials to update it.

Template went to the wrong Postmark server: Each Postmark server has its own Server Token. If you have multiple servers (e.g. Production, Staging) make sure you saved the token for the right one. Add a new connection with a clearer name if it helps.

Unsubscribe link not working: Make sure your design includes an Email Love Footer with an Unsubscribe link. Without one, the plugin has nothing to swap Postmark's unsubscribe tag into.

My Postmark layout's styles are missing: That's expected β€” Email Love exports in standalone HTML mode (LayoutTemplate: ""), which deliberately bypasses the shared layout system. Build any header/footer/boilerplate styles into your Figma design instead.

Plain text looks weird: Postmark uses the auto-generated plain-text version. If you need a custom plain-text body, you can edit the TextBody directly in the Postmark template editor after export.

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?
😞
😐
🀩