Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Why are some fonts pixelated (mostly Open Sans) in browser?

  • 9 cavab
  • 20 have this problem
  • 4 views
  • Last reply by effgo

more options

Some websites have very pixelated text in my Firefox Browser. As an example most of the text on Mozilla's sites (which I believe is Open Sans) is very pixelated compared to other websites. I have ClearType disabled in Windows because I find that text is clearer with it disabled. Is there a setting I can change in Firefox to fix the pixelated fonts? I can probably force websites to use only one font but I would prefer to use the fonts specified by the website.

Some websites have very pixelated text in my Firefox Browser. As an example most of the text on Mozilla's sites (which I believe is Open Sans) is very pixelated compared to other websites. I have ClearType disabled in Windows because I find that text is clearer with it disabled. Is there a setting I can change in Firefox to fix the pixelated fonts? I can probably force websites to use only one font but I would prefer to use the fonts specified by the website.

All Replies (9)

more options

This question's page says that enabling ClearType solves the problem (if this is the same as your problem). However, if that doesn't work or you really don't want to, you could read this.

more options

Just a footnote in reference to Jess Stryker's article that the gfx.content.azure.enabled preference no longer exists in Firefox 28. In other words, it is always enabled now.

I think someone developed a hack in another thread to substitute specific fonts, so if you develop a list of fonts that do not render nicely you could instead use a more traditional font in their place. Sounds like it might be more effort than it's worth unless readability is a major problem.

more options

Try to disable Direct2D by setting the gfx.direct2d.disabled pref to true on the about:config page and leave hardware acceleration otherwise enabled.

See also comment 414 in bug 812695:

You can create this Boolean pref on the about:config page:

  • layout.paint_rects_separately = true
more options

Neither layout.paint_rects_separately nor enabling cleartype system-wide fixes the problem for me. It's an ordeal to look at such '95 fonts every day! I have not such issues with IE. I can clearly see blocks e.g. in the 'C' in the 'Commited' title here https://www.mozilla.org/en-US/firefox/32.0.2/whatsnew/

Win 7 x64, updated FF 32.0.2 22" 1920x1080 display

more options

Hi effgo, if you double-click the word Committed, then right-click > Inspect Element (Q) then activate the Font panel on the lower right (see screen shot), if Firefox downloading the custom font used on that page or substituting a font on your system?

more options

It says 'remote' : https://mozorg.cdn.mozilla.net/media/fonts/OpenSans-Light-webfont.woff Please note that I've only used it as an example. It's not the only font I see pixelated.

more options

Hi effgo, thanks for checking that, so the problem is not related to font substitution.

Are you able to use hardware acceleration in your Firefox? Unfortunately, Firefox is incompatible with some graphics card drivers, but if yours is compatible, that may give you smoother results. You can check the current status on the "Troubleshooting Information" page. Either:

  • "3-bar" menu button > "?" > Troubleshooting Information
  • (menu bar) Help > Troubleshooting Information
  • type or paste about:support in the address bar and press Enter

You can scroll down to the Graphics section or search in the page for "GPU Accelerated Windows". If the numerator is more than zero, then hardware acceleration is in effect.

more options

Thanks for bearing with me. It's GPU Accelerated Windows 1/1 Direct3D 9

I've also tried: - enabling/disabling HW acceleration - enabling/disabling 125% Windows scaling - calibrating cleartype - testing with a clear profile without addons (separate install)

Modified by effgo

more options

OK, I've opened the 'Adjust ClearType text' windows settings window and tried watching how fonts in Firefox change when I enable and disable it. And guess what. The blocky 'C' on mozilla website turned into a nicely rendered 'C'. Then I tried different websites only to conclude that on some websites fonts are better rendered with and some without Windows ClearType enabled. But almost always - disabling ClearType makes fonts too 'thin'. Examples: Mozilla > About  : OFF http://kotaku.com/  : ON http://outlook.com/  : ON http://arstechnica.com/  : OFF

Edit: I'll file a bug report.

Modified by effgo