Experiencing missing fonts in your Figma file? Figma currently blocks users from editing text they don't have the fonts for. Read on to learn more about what this means and how to resolve it.
When you use Figma, you have access to 1) any of Figma's default fonts and 2) any fonts installed locally on your computer. If a Figma file is using a font that isn't one of these, you won't have access to it. This means that you'll be able to view any text using that font in the Figma file, but Figma will stop you from actually being able to edit them.
As a result of this issue in Figma, Ditto's Figma plugin also won't be able to update those text layers and will hit an error when "resyncing" between Ditto and Figma:
You can check if you're missing fonts in a file by heading to the top right of the Figma file. If you are, you'll see a yellow A?. Click it to open a modal where you'll be able to see exactly which fonts are missing:
There are a two main ways to fix this issue:
The easiest way to get the missing font files is to contact the owner of the Figma file — they'll likely have those files on their computer. Once they share those files with you, add or install the font onto your computer:
Then, quit and restart Figma. The next time you open the Figma file, you should no longer see any warnings for missing fonts for those that you installed. You should also be able to edit the text in the Figma file that uses those fonts. Now that the font issues in Figma are resolved, Ditto's Figma plugin will also be able to update text. When you open the plugin, you should be able to resync successfully and should no longer see any messages about missing fonts.
If you're not able to get access to the files for the missing fonts, you can replace the missing fonts with ones you do have access to instead. It's important to check with the file's owner before you do so, though! Replacing fonts will alter the Figma file itself and therefore apply to everyone accessing the Figma file, not just you.