Overview
The Mailkick Export Figma plugin allows you to copy your email designs from Figma and paste them directly into the Mailkick editor. The plugin preserves your layout, typography, colors, and images.You need a Mailkick account to use this plugin.
Installation
- Open Figma and go to Plugins > Browse plugins in Community
- Search for “Mailkick”
- Click Install
How to use
Step 1: Select your design
In Figma, select the frame or elements you want to export. The plugin will show you how many elements are selected.Step 2: Copy your email
- Open the plugin: Plugins > Mailkick Export
- Keep Include the images switched on
- Click Copy to clipboard
- Your design and its images are now in your clipboard
Step 3: Paste in Mailkick
- Open your email in the Mailkick editor
- On an empty email, click Paste from Figma. Otherwise click anywhere in the editor and press
Cmd+V(Mac) orCtrl+V(Windows) - Your design is imported and its images are uploaded to your library
What gets imported
Tips for best results
- Use Auto Layout - Frames with auto-layout convert better to responsive email layouts
- Keep it simple - Complex nested structures may not convert perfectly
- Name your layers - Well-named layers make it easier to edit in Mailkick
- Use solid colors - Gradients have limited support in email clients
- Design at 600px width - This is the standard email width
Troubleshooting
Images are not showing
Make sure Include the images was switched on when you copied. A few very heavy images can be left out to keep the copy fast: the plugin tells you so, and those images appear as placeholders you can replace from the image panel.Layout looks different
Email clients have limited CSS support. Some Figma layouts may need adjustment in Mailkick for best email compatibility.Plugin not working
- Make sure you have elements selected
- Try refreshing Figma
- Reinstall the plugin if issues persist
