logo
Resources
Table of content
Motiff AI
Interface
Layers and tools
Layer properties
Design systems
Prototypes
Dev Mode
Collaboration
Import and export
File settings
Account
File management
Team management
Sharing and permissions
Billing
Organization
Apps
Work with support
Help Center/Import and export/Import files from Figma

Import files from Figma

Motiff has a high fidelity for importing Figma files, having the abilities to perfectly restore vector networks, auto layout, component connections, etc. It allows you to seamlessly continue your previous work.

Figma file import

Preparation before migration

Components and styles

For files imported using Motiff's Import file feature, Motiff will not preserve cross-file component connections if the file has instances that applied components from other files. To facilitate the editing process, Motiff will generate a main component of the instance in this file.

If you want to retain the connections of components & styles between Figma files, Motiff provides comprehensive component migration capabilities. You can use the Import library feature to import files.

Fonts

If you are using local fonts in Figma, you need to download and install the Motiff Font Agent to ensure that the imported fonts are displayed correctly. Learn more about local fonts.

Download Figma file

  1. 1.Open the Figma file you want to download, and click on the main menu in the top left corner of Figma.
  2. 2.Select File.
  3. 3.Click Save local copy… to download the file.

'download Figma file.png'

Import

  1. 1.

    In the workspace, click the Import file button.

    'import file.png'

  2. 2.

    In the Import modal, select the file you want to import. You can add files to be imported in the following ways:

    • Click the dashed box to bring up the local file selection modal and select the file to import.
    • Drag the file directly into the dashed box.

    'import modal.png'

  3. 3.

    After selection, click Import to start importing the file.

    'import.png'

  4. 4.

    After the import is completed, return to the workspace to view the file.

    'import 2.png'

Figma component migration

Motiff provides comprehensive Figma component migration capabilities. Files imported using the Import library feature will restore the connections of components and styles between Figma files.

Component migration notes

  1. 1.Motiff's component migration feature requires importing the component library and design files separately through different entrances. Motiff will keep the connections between main components and styles in the libraries, as well as the instances and style applied in the design files.

Note: How to distinguish between a library and design file?

Library: A file that has been published as a component library in the original team or organization.

Design file: A file that applies the components and styles from the libraries.

  1. 2.Individual users must import the libraries and design files under the same team, while organization users only need to import them under the same organization to maintain the connections between components.

Note: You must use the Import library feature to import files into the same team. If you import them into different teams and then move them to the same team, the connections cannot be established.

  1. 3.The order of importing the libraries and design file does not affect the connection.

Component migration process

  1. 1.

    In the top right corner of the workspace, click the Import library button.

    'import library.png'

  2. 2.

    Open the Import library modal, select the team you want to import to and choose from Import libraries or Import design files based on the file type.

    'import library.png'

  3. 3.

    After entering the import modal, select the project you want to import to.

    'import libraries.png'

  4. 4.

    Add the file you want to import by selecting or dragging the file into the modal.

  5. 5.

    After adding, click Import to start importing the file.

    'import 2.png'

  6. 6.

    After the import completes, you can view the imported files in the Import library modal.

    'import library 3.png'

Special cases

Repeated import of libraries

Within the same team or organization in Motiff, the same library cannot be imported repeatedly. When importing repeatedly, you must decide whether to replace the existing libraries.

'replace library.png'

Loss of connections

  1. 1.Loss of connection data in design files

Some Figma design files may have issues with the loss of connection data. Motiff needs you to authorize file access permission in Figma to retrieve the lost data.

'loss of connection data in design files.png'

  1. 2.Loss of connection data in the libraries

Some Figma libraries may have issues with the loss of connection data. Motiff will access the file link you provide in Figma to retrieve the lost data.

'loss 2.png'