If you'd like to import from Figma, please do the following:

  1. Go to Code > Import
  2. Choose Figma in the dropdown
  3. Log in or create a Figma account and then select the file you'd like to import. You can read more about the integration here: https://blog.framer.com/a-simple-way-to-import-and-iterate-with-figma-8cf0cd4d21b3

In general, here are a few things to keep in mind about importing with Figma:

  • Group layers and name them in Figma in order to import them into Framer. Ungrouped layers will not be included in the import.
  • You can only animate imported files from Figma in Framer’s Code tab—they will not appear in the Design tab.
  • You must use accurate syntax when calling your imported layers. For example, you would use figma.Load.animate to animate a layer named Load. 
  • To animate specific layers, right click on the layer names in the Code panel and use Auto-Code.
Did this answer your question?