Framer
  • Support
  • Using Framer
Framer
  • Why Framer
  • Teams
  • Learn
    • Tutorials
    • Examples
    • Templates
    • Sessions
    • Speedruns
  • Pricing
  • Blog
  • Updates
  • Support
  • Support
  • Using Framer

Related Articles

  • Importing from Sketch
  • Importing a React Design System
  • Using NPM packages in Framer
  • How do I import my Sketch and Figma projects?
  • Archiving a Project

Importing from Figma

You can import your Figma designs into Framer using Framer's Figma Importer.

From the Editor

To import a Figma project from the Editor, click Menu > File > Import from Figma. This will open the Figma Importer for the current project.

Authenticating

The first time you open the Figma Importer, it will ask you to authenticate with Figma. Click Authenticate to visit Figma's authentication page. Click Allow Access to authenticate and return to your Framer project.

Importing

Once you've authenticated, visit the Figma project that you'd like to import from and copy that page's URL.

Back in Framer, paste this URL into the field labeled Paste Figma URL.

In the drop-down menu, choose the page from this project that you'd like to import, then click Import.

Figma import pop-up that allows you to import

Figma import pop-up that allows you to import

Feature Support

When you import a Figma project, Framer will convert Figma’s frames, shapes, text, and other layers into their corresponding Framer layers.

While Framer supports most of Figma's features, you may find that certain features do not import correctly. Below is a list of features that are either partially supported or not yet supported.

Partially supported:

  • Rotation
  • Figma colors
  • Image fill properties
  • Text with multiple styles
  • Vector strokes
  • Vector image fills
  • Vector stroke location

Not yet supported:

  • Multiple fills
  • Blend modes
  • Image fill rotation
  • Diamond gradients
  • Angular gradients
  • Masks
  • Image fills on text
  • Gradient fills on text

Our team is working to expand support for these features in the future. To report a bug not listed above, let us know here.

Helpful?Was this article helpful?

0

0

Framer

  • Why Framer
  • Teams
  • Pricing
  • Blog
  • Updates
  • Motion

Platforms

  • Web
  • macOSbeta
  • WindowsBeta
  • iOS
  • Android
  • Figma Importing
  • Sketch Importing

Learn

  • Tutorials
  • Examples
  • Templatesnew
  • Sessions
  • Speedruns

Resources

  • Packages
  • API
  • Input Kitnew
  • State of Prototyping
  • Desktop Prototyping
  • Prototyping Tool
  • Mockup Tool
  • Wireframing Tool
  • UI/UX Design Tool
  • Graphic Design Tool
  • User Testing

About

  • Loupe
  • Community
  • Company
  • Careers
  • Legal
  • Security

Support

  • Using Framer
  • Accounts
  • Contact

  • Twitter
  • Discord
  • Dribbble

Copyright © 2021 Framer B.V.

  • Security
  • Terms of Service
  • Privacy Statement