Design Mailchimp Emails in Figma and Export with Marka

Design Mailchimp Emails in Figma and Export with Marka

Create your next Mailchimp email in Figma, where you can work on the layout, copy and imagery together. Marka Email Generator connects the finished design to your Mailchimp template workflow.

Start with a Figma email template and open Marka. This guide uses a product announcement as the example.

Build the first screen around the announcement

Put the headline, a short explanation and the main action at the top of your frame. Use a product image that adds information rather than repeating the headline.

Try the real campaign copy before adjusting spacing. A two-line product name or a longer button label can change the balance of the section. Review the design at actual size, then check how it looks on a narrow screen.

Create sections you can reuse

Make the header, button and footer consistent with your other campaigns. Use shared Figma components for repeated elements so future editions begin with the same brand choices.

For a launch email, add one feature section below the main announcement. For a newsletter, use a lead story followed by short supporting items. Keep the primary action more prominent than the secondary links.

If you want a larger starting library, explore the email design system.

Prepare copy, links and personalization

Add the destination for the main action and check each supporting link. Write the subject and preheader together, keeping the preheader useful even when the subject is shortened in an inbox.

Ask the campaign owner for the Mailchimp fields and footer content the email needs. Review a personalized greeting with both a long name and fallback copy in Figma, then verify the real fields in Mailchimp after export.

Keep customer-specific content clearly labeled in review frames so sample names do not accidentally become campaign copy.

Preview and export to Mailchimp

Review the layout in Marka, then choose its Mailchimp export option and configure the account connection using the export documentation. The exported design is available in Mailchimp's templates.

Use the full Figma export walkthrough if you need help preparing the frame, preview or image assets. Check Marka plans for the applicable export allowance.

Finish the campaign in Mailchimp

Use the exported template for your campaign and review it with the intended subject, sender details and audience settings. Check personalization and footer links in the platform rather than treating Figma's sample content as the final result.

Send a test and inspect it on a phone and desktop. Check the hero image, button destination, text wrapping and footer readability. Return to Figma for visual revisions, then export the updated design.

Save the next campaign's starting point

Keep a copy of the approved frame with a clear campaign name. Duplicate it for the next announcement and change the content while retaining the reusable sections.

Design your Mailchimp email with Marka, or explore the Mailchimp integration overview.

More articles