What strikes me about the Firefox side of your screenshot is that letters look a bit "squashed" vertically. I don't know what could cause that. Do you have a page online that demonstrates the problem?

When I compare Firefox and Chrome on https://fonts.google.com/specimen/Rubik (changing the body text to Rubik), the Chrome rendering is a bit lighter, and the Firefox rendering has the characteristic heavier sub-pixel anti-aliasing. (Comparison attached.) what kind of result do you get on that page?

Firefox uses Windows ClearType for font smoothing, and takes advantage of hardware acceleration for best results. If you see the identical rendering between Firefox's Safe Mode and regular mode, there could be a problem with hardware acceleration not working normally. However, the diagnostic info you shared shows:

• direct2DEnabled: True
• directWriteEnabled: True

So I think hardware acceleration is at least running.

Firefox has settings that could affect font rendering you can view in about:config:

(1) In a new tab, type or paste about:config in the address bar and press Enter/Return. Click the button promising to be careful or accepting the risk.

(2) In the search box above the list, type or paste font_r and pause while the list is filtered

(3) Preferences with non-default values typically are bolded and show a status of "Modified" -- you can restore the original value using right-click > Reset

Thanks for your fast reply!

#1. I know that fonts can be slightly different on different browsers. I'm well aware of that.

The thing is that I'm not talking about Mozilla vs other browsers. I'm talking about Mozilla on my PC vs Mozilla on other PCs.

In my attached image, it's the font on Mozilla on other PCs and my own before it changed (left) vs Mozilla on my PC now (right), after it got messed up.

It worked fine on my PC until today. It just suddenly changed. That image is basically a before and after.

For example, if I check that font (the Light 300 version) on different websites, on my laptop, using Mozilla, it looks fine, as you can see on my image, on the left.

If I ask a friend to check it out using Mozilla, it looks fine. If you check it out using Mozilla, it will look fine.

That's because the problem seems to only be with the Mozilla browser that's on my desktop PC, not on other devices as well.

That's what makes the issue so strange and senseless. The same font that looks fine on other Mozilla browsers from other devices, looks messed up on my PC.

#2. The diagnostic info I shared is the one from the new, fresh Mozilla installation.

As I mentioned above, I did perform a Safe Mode troubleshooting, which disables hardware acceleration by default. So, that can be excluded.

#3. I checked about:config and everything's set to default.

I literally have no idea what could cause this.

Could you try:

New Profile Test

This takes about 3 minutes, plus the time to test your problem font.

Inside Firefox, type or paste about:profiles in the address bar and press Enter/Return to load it.

Click the Create a New Profile button, then click Next. Assign a name like Nov2018, ignore the option to relocate the profile folder, and click the Finish button.

After creating the profile, scroll down to it and click the Set as default profile button below that profile, then scroll back up and click the Restart normally button. (There are some other buttons, but please ignore them.)

Firefox should exit and then start up using the new profile, which will just look brand new. Please ignore any tabs enticing you to connect to a Sync account or to activate extensions found on your system so we can get a clean test.

Does the font render any differently in the new profile?

When you are done with the experiment, open the about:profiles page again, click the Set as default profile button for your normal profile, then click the Restart normally button to get back to it.

Did it, but there's no change.

I also did this when I troubleshoot the issue since I completely uninstalled Mozilla and deleted the Firefox folder from the AppData folder.

This issue is definitely one for the books.

Running out of guesses... Is it possible this PC has a locally installed copy of Rubik in the Windows font folder that Firefox might be using instead of the downloadable version??

Does this also happen on the Google website (I'm not sure you confirmed this)?

• https://fonts.google.com/?query=rubik

Did you confirm on the Font tab in the Inspector that Firefox is using the Rubik font?

jscher2000 said

Running out of guesses... Is it possible this PC has a locally installed copy of Rubik in the Windows font folder that Firefox might be using instead of the downloadable version??

That's it! I would have never thought of that! Thank you!

I had the Rubik font installed in Windows as well, to use it in Photoshop for the logo, and for some reason, Firefox decided to use that or create some sort of conflict.

It's very weird because this never happened before, and I always install fonts locally for Photoshop.

I don't know why it decided to do this for this particular font and after several days, not from the start.

Is there a way to prevent this from happening in the future? A setting in Firefox or something?

Thanks again! I appreciate it!

I think that the Font tab in the Inspector would have stated that a local version and not a remote version of the Rubik font was used.

Deleting the local font may be an effective workaround, but I don't know why it stopped working. I imagine something was weird with the metrics, and that caused Firefox to squash it, but I don't know where that information comes from for local vs. downloaded fonts.

cor-el said

I think that the Font tab in the Inspector would have stated that a local version and not a remote version of the Rubik font was used.

I checked that before when it was messed up and now when it's fixed.

Just to be sure, I reinstalled the font locally to mess it up, used Inspect Element again, and it shows the same thing on both cases (see attached).

Perhaps I didn't look in the right spot...

Radu_B said

Perhaps I didn't look in the right spot...

Looks like they moved the path information down into the "All fonts on page" section, which might cause some ambiguities from time to time...

It looks that you currently need to click "all fonts on page" to see more information about the origin of each font (URL or System font).

Yep, I didn't look there, unfortunately.

When I have Rubik installed locally as well, it says "System" in the "All fonts on page" section.

Even if I would have seen it, I'm not sure that the penny would have dropped :).

Thank you!

Thanks for confirming that it is possible to see whether a local or remote font is used.

Maybe the font that was installed locally is an older version.

Could be. I downloaded it from Font Squirrel.

In my experience, local font files typically cause this problem. I've experienced it in both Firefox and Chrome. While browser extensions can solve the problem with varying degree of success, the best solution is to uninstall the offending font file. Typically it's Helvetica or another commonly used font. You can ID the font in question definitively with Inspect Element.

In the future you can install the font briefly when you need it and uninstall it when you're done.

Another possibility is that renaming the font could make it unique enough such that it's not accidentally called by your browser.

I got exactly the same problem;

and Mozilla is now confusing my webfont with Times NEW Roman on system; and system says - you cannot delete System font (Times New Roman); and what should I do now?!

I have several sub-sites with exactly the same configuration, and there fonts are working correct. Also on this website fonts in Chrome are working correct; but not on Mozilla; and I don't like Chrome, use it only for testing....

Is your webfont named similarly to Times New Roman? You should rule out a naming issue.

Then you should test other machines and browsers. Then try a clean Firefox Portable install / disable all your extensions. If that works, then extensions are the problem and you need to renable them one-by-one.

Hi zambala, it sounds as though there must be some difference between your sites if Firefox works correctly on most of them and falls back to the default font only on one of them. Does the Web Console show any message about the font not being loaded for some reason? https://developer.mozilla.org/docs/Tools/Web_Console