Missing fonts in prototype - Interactive components

Quoted from Figma article to make your own fonts work properly in the client’s browser (or without showing “Some missing fonts were replaced”), your client must:

Alternatively you must use any of Google fonts in your prototype.

Currently I haven’t found any article described about the embedded custom web fonts to work similarly as the Google fonts which are publicly accessed.

I hope this can help.

1 Like

Unfortunately its happening with google fonts like Roboto too for me. The craziest thing is how randomly it starts and stops, so there’s no way of doing a work around cause we don’t know why its happening. The same prototype works for days, until… it just doesn’t?

2 Likes

It doesn’t help. 3 years can’t pay attention and fix this problem. Hey, Figma team, where are you? Can you hear us? This is too minor a problem, because of which you will have to think in the direction of another prototype editor.

2 Likes

I think I may have resolved Fontawesome issue on my end. I realised I am only having the issue on my Mac, not PC so narrowed it down to locally installed Fontawesome font.

I disabled the font in my Font Book on Mac. The Fontawesome is now working in my prototype. It seems that Figma was getting confused as it may have been referencing two Fontawesome fonts installed within app vs on my laptop.

I ll keep on monitoring if the issue arises again.

We had the same issue as others have posted here. When someone is using the prototype the words would disappear as their mouse ran across them. Some words would stay invisible, rendering the prototype useless. We had the same error of “some missing fonts were replaced”. We tried installing fonts and even updating it all to a common font like Arial and that did not work.
However, we had the idea to go to the Figma Downloads | Web Design App for Desktops & Mobile page and install just the Figma font installer on their machines (even though they were just accessing the link to the prototype and not using Figma itself). This actually worked so there is no longer an issue with missing fonts when they access prototypes. Hopes this helps others!

1 Like

Same for me. It even replaced Times New Roman for me.

1 Like

Same issue here. This post has tons of replies. Please fix this bug :smiley:

For me the problem is not when I’m previewing the prototype on my computer, but ether when I’m mirroring it on my phone, or when my clients are viewing the prototype on their computer. It is also very random. In a page with 20 components that are duplicates of the same master component, 4 can have this issue, and the rest will render the font correctly.
I also experience this issue when I change variants in the live prototype.
Figma pleaseeeee fix this. It’s happening for way tooo long. Not cool!

Same here, our design system doesn’t use a Google Font and I thought that could be the issue so I switched every text layer to use a similar one on Google Fonts. I worked for a few hours and then back to this annoying error which makes text disappear. So even the error is misleading because it replaced nothing, it actually disappeared!

Guess why I found this post X(
Every time when i open Figma file, text on instances are gone and i need to click them one by one to let them visible, which means i need to remember where should contains text and it duplicate work before review meeting… it is too annoying! hope it can be fixed ASAP…
屏幕截图 2024-09-27 113101

@Claire_Z Run Regenerate All Instances command instead of clicking on them

Thank you Nellya!! You really enlighten me!!! :clap: :clap:

1 Like

Hello, can we get an update on this?

Just started seeing this too. It happens with Google Fonts, randomly.
In my prototype I have a set of variables (font family, weight, size) and 3 modes. When in prototype I switch mode some fonts randomly get replaced.

Can we get an update on this issue? This problem makes it difficult to share with clients that do not have these fonts installed. Almost makes sharing prototypes useless.

1 Like

Same for me, font switches to another weight in prototype.
Is there a solution?

Hello everyone,

I encountered the same issue during remote usability testing of the Figma prototype in (respondent’s) browser. In our scenario, we have some text string which needs to be changed to another string using a variable and as the interaction was triggered, “some missing fonts were replaced” and on the top, not every text using this variable was updated (which caused logical issues in the test scenario).

This seems to be problem when using local fonts, and apparently as the browser uses “canvas” element where everything is drawn by javascript, Figma prototype in browser can not change the text to other string on the fly. I filed a bug report and hopefully will hear about it soon.

As a workaround, we did the following: since we only need the text to be either “string A” or “string B”, we created a component with both strings as variants. Then, using interaction we only change that component variant, not the string variable. That way Figma can “draw” the text layer (in the background probably just vector/outline of the original text).

I can update you with information from Figma team once I hear back about the bug report.