From Sketch to Figma, will your file be preserved? In this article we look at the conversion of several elements from Sketch to Figma. We also explain how to migrate your Sketch models and designs to Figma.
Migrating your web mockups, wireframes, and other Sketch visuals to Figma can be done very easily.
You can first import an entire Sketch file (.sketch) into Figma, which will automatically create a new Figma file with all the graphic elements. This conversion of a Sketch graphic model to Figma is done at 4 levels:
- Page conversion
- Symbol conversion
- Font conversion
- Style conversion
Converting Sketch pages
Figma allows you to create multiple pages within a single file. Each of the pages in your Sketch file will be recreated iden tically when imported. You can find your new Figma pages in the Layer panel on the left of the editor mode.
Conversion of symbols to components
Figma has a "Components" feature, similar to the "Symbols" feature in Sketch. When exporting Sketch to Figma, each of your symbols will be transformed into components, and a "Symbols" page will be created to group all the new components in the file.
Font conversion in Figma
Fonts used on your Sketch File will also be carried over to Figma when imported, provided they already exist in Figma. Figma uses fonts from the Google Web Font catalogue.
It is possible that the fonts are not imported correctly, and you will get a "Missing fonts" error message. To solve this problem, you will need to import your new fonts into Figma, then use the "Replace fonts" feature to update all the text at once.
Style conversion
Styles created in Sketch cannot be copied into Figma. To facilitate the design you will have to create new styles in Figma.
Importing a Sketch file into Figma
There are several methods to migrate Skecth elements or files to Figma.
- Drag and drop a .sketch file from a desktop to the Figma dashboard.
- Download a .sketch file from a new Figma file
- Copy / Paste graphic elements from a Sketch project to a Figma page
Here is how to import a new Sketch file from a Figma file:
- Click on the menu at the top left
- Go to the"File" tab
- Click on "New from Sketch File".
- Select the .sketch file to import it
Discover the detailed Figma vs Sketch comparison