> ## Documentation Index
> Fetch the complete documentation index at: https://docs.migma.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Figma Integration

> Connect Figma to import frames and export reviewed email work for design handoff.

Use Figma when a design already exists and Migma should turn it into an editable, email-safe email. You can also export reviewed email work for Figma handoff when your team wants to keep design review in Figma.

Figma import works best for single email frames, landing-style announcement designs, and campaign modules that need to keep visual direction while becoming production email.

## What you can do

<CardGroup cols={2}>
  <Card title="Import a frame" icon="arrow-down-tray">
    Paste a Figma frame URL and convert it into editable email.
  </Card>

  <Card title="Use private files" icon="lock-closed">
    Connect Figma so Migma can access files your account can view.
  </Card>

  <Card title="Review and edit" icon="pencil-square">
    Continue in chat, visual editor, or code view after import.
  </Card>

  <Card title="Export anywhere" icon="arrow-up-tray">
    Export the finished email to files, campaigns, Figma handoff, or connected platforms.
  </Card>
</CardGroup>

## Connect Figma

<Steps>
  <Step title="Open brand integrations">
    Open the brand you are working in, then open **Integrations**.
  </Step>

  <Step title="Connect Figma">
    Choose **Figma** and approve access. Migma stores the connection for that brand.
  </Step>

  <Step title="Paste a Figma URL">
    Copy the Figma frame URL and paste it on **Create** or into design chat.
  </Step>

  <Step title="Review the email">
    Check layout, images, links, mobile behavior, and preflight results before export or send.
  </Step>
</Steps>

<Info>
  For public or shareable Figma links, you can often paste the URL directly. Connect Figma when the file is private or your team imports from Figma often.
</Info>

## Export to Figma

From **Publish**, choose **Figma** when the reviewed email should move back into a design handoff flow. This is useful when designers want to inspect or adapt the final email structure after Migma prepares it.

<Note>
  Figma export is a design handoff path. For production delivery, use [export options](/email-editor/export-options), Migma sending, or a connected marketing platform.
</Note>

## Prepare the Figma file

For best conversion quality:

* Use one frame for one email.
* Keep the email width close to typical email dimensions.
* Use Auto Layout where possible.
* Use real images instead of screenshots of text.
* Name important sections clearly.
* Flatten complex icons or decorative vectors when they are not meant to be edited.

<Card title="Designing in Figma for Email" icon="ruler" href="/creating-emails/figma-design-guide">
  Set up a Figma file so Migma can convert it cleanly.
</Card>

## Related docs

<CardGroup cols={2}>
  <Card title="Figma to Email" icon="https://mintcdn.com/migmaai/kT6TJgF40rDP8_qB/images/logos/figma.svg?fit=max&auto=format&n=kT6TJgF40rDP8_qB&q=85&s=1388542bde3d29ae9480addef82339cf" href="/creating-emails/figma-import" width="24" height="24" data-path="images/logos/figma.svg">
    Step-by-step import workflow.
  </Card>

  <Card title="Client Compatibility" icon="check-circle" href="/email-editor/client-compatibility">
    How Migma renders imported designs for Outlook, webmail, and mobile.
  </Card>

  <Card title="Export Options" icon="download" href="/email-editor/export-options">
    Export the finished email after review.
  </Card>

  <Card title="Email Preflight" icon="shield-check" href="/email-editor/email-preflight">
    Check rendering, content, and deliverability before launch.
  </Card>
</CardGroup>