Fonts on firefox pages displaying random colors

Most websites with text display random blue letters or blue parts of letters which are supposed to be black. Some have other colors

It started a couple of weeks ago on both Endeavour KDE and my Manjaro KDE after I updated them both. XFCE still displays everything perfectly so it’s not my monitor. I didn’t change any of the fonts recently

Here’s a picture of some text at the top of this page, first the correct render on XFCE and in the second screen capture on KDE you can see a few random blue letters. Does anyone know what’s causing this?

I’m not sure that the pics you posted show much - perhaps it self-corrected in the screenshot app? Or, perhaps, my eyes just can’t see it… Anyway - here is a possible help that I picked up elsewhere…

mv ~/.config/fontconfig/fonts.conf  ~/.config/fontconfig/fonts.conf.bak

followed by:

sudo fc-cache -fv

which should rebuild the font references. It can’t hurt anything, anyway! :grin: (At worst - just copy the backup file back to the normal name…

1 Like

Something is up with the Firefox subpixel rendering/anti-aliasing. Since ca. two weeks ago fonts started to look atrocious. Mostly too thin and very badly hinted.

I just ‘fired up’ Firefox, and nothing appears to be different on mine. I’m set to Deja Vu serif (16) and all appears well. I’m on a 4K monitor, though, so that may be affecting (ie: helping) the situation. I saw something similar in another arch-based distro - and the ‘help’ described above cured it (weird colours in small conky fonts)

I’m not sure that the pics you posted show much - perhaps it self-corrected in the screenshot app? Or, perhaps, my eyes just can’t see it…

Maybe you couldn’t see it cause the blue letters are on the first picture not the second as @Archnoob said, it should be reversed

first the correct render on XFCE and in the second screen capture on KDE you can see a few random blue letters. Does anyone know what’s causing this?

Hi @Archnoob

first if it works on XFCE it’s not you hardware.
Which font do you use ?
Did you try another browser to check if only Firefox is the culprit ?

Then check if in disabling the font hinting through KDE settings resolves it ?
Could be also the Anti-aliasing that convert the vector font as bitmap, you could test to disable it also ?

  <match target="font">
    <edit name="hinting" mode="assign">
      <bool>false</bool>
    </edit>
  </match>

  <match target="font">
    <edit name="antialias" mode="assign">
      <bool>false</bool>
    </edit>
  </match>

Note: For some desktop environments (such as GNOME and KDE) using the Font Control Panel will automatically create or overwrite the user font configuration file. For these desktop environments, it is best to match your already defined font configurations to get the expected behavior. Also ensure that the desktop locale settings or Regional Settings are supported by the configured fonts, if not the font configuration could be overidden.

In watching better you screenshot, there is not only blue but red and green around letters, wich means RGB !

Then you could check into /etc/fonts/conf.avail if sub-pixel RGB is enable or not ?

Praise the Arch Wiki!

Starting from FreeType 2.10.3, Arch Linux enables ClearType subpixel rendering by default [4].

When using ClearType subpixel rendering, you should enable the LCD filter, which is designed to reduce colour fringing.

So let’s enable one:

# ln -s /etc/fonts/conf.avail/11-lcdfilter-default.conf /etc/fonts/conf.d/
# fc-cache --force

Restart Firefox. Much better. :clap:

2 Likes

Must be “fc-cache --force”

1 Like

I had the same problems as the OP but your advice did the trick :smiley:
Even my weird fonts in GNOME are clear now, thank you!

I noticed this yesterday, but I fixed by selecting “None” under sub-pixel rendering in System Settings -> Fonts

Also, I set GTK_USE_PORTAL=1 when running Firefox, as described here.

Not the best idea i’d say :upside_down_face:

P.S. I use GTK portal, btw :rofl:

1 Like

looks good to me

2 Likes

Wonder why the hell they have enabled subpixel rendering without enabling LCD filter by default…
That’s kinda stupid :thinking:

1 Like

Even with Subpixel-Rendering active the fonts weren’t rendered in the desired way in GNOME


How would I know then? :roll_eyes:

1 Like

fontconfig lives by it’s own, if you don’t know about it’s existence - you’re doomed to see that crap…
Why it’s not controlled by DEs…No idea :laughing:

Must be a regression. With GNOME 3.36 all went well. It’s the first time since a couple of years I have to struggle with “fontconf”. The same is true of KDE and it’s rendering. Yeah, “wonder why”…

I think it was always this way, it’s just fonctonfig had more matching default settings to average DEs before, so it wasn’t that obvious

1 Like

I installed Chromium to check and it rendered fine, so I’ve isolated it to the combination of Firefox and KDE. When I magnify a Firefox browser tab to 120% or higher, the problem goes away for some reason.

The pictures from my first post aren’t really easy to see. I cut a tiny piece of text from the the EOS Wikipedia page and blew it up in GIMP to show some blue letters

Screenshot_2020-10-21 EndeavourOS - Wikipedia

Just do that and restart browser it should be fine

2 Likes

Thanks, this one worked

1 Like