Figma Import - Using Custom Fonts

Overview

There are a few additional steps required when importing a Figma file that uses custom font files. For information on the standard Figma import process, please reference the following article:

Figma Import

Importing Figma Files with Custom Fonts

1. Start the export process - When exporting your Figma file, you will get a pop-up window that detects any custom fonts in the file. To export correctly, a custom ID is needed for the font file, as shown here:
   
2. Upload your fonts into Fastr Frontend - To get this font ID, you will need to upload the custom font into the Fastr Frontend dashboard. This article can be used as a reference: Uploading Custom Fonts
   
   
3. Copy the font ID  - After uploading your fonts, the font ID can be found underneath the font name. You'll need to copy the value for each font in your file. 
   
4. Use the Font ID in Figma - Switch back to your Figma file, where the Penpot Exporter plug-in is activated. Paste the copied font ID into the appropriate field within the plug-in interface, matching it with the corresponding font.

After adding the Font IDs, you should be able to export the file with all of your fonts correctly linked. If you run into any questions or concerns, please reach out to support@getfastr.com