How to set black fonts in Ubuntu MATE

Updated: July 11, 2020

Most Linux distributions have this or that problem with fonts. Either they use bad fonts, suboptimal anti-aliasing and hinting, or the font color is wrong, resulting in a low-contrast setup that can cause eye strain. Or all of it. In Ubuntu MATE, the font choice and anti-aliasing are jolly, but the fonts are not 100% black, and this is a problem. With light themes, fonts should be pure black (hex value 000000).

In some desktop environments, changing font color is easy - hint, Plasma. But in MATE, this cannot be done using a UI tool. We will need to edit the system theme, similar to what I've shown you in Gnome 3, and more recently when I tested Linux Mint 20 Ulyana Xfce. In fact, what you learn today is applicable for any Gtk-based desktop, be it MATE, Cinnamon, Gnome, or indeed Xfce. But since I've doing a fair deal of testing and tweaking in the MATE environment lately, in an attempt to use Raspberry Pi 4 as a mini desktop, we will focus on Ubuntu MATE. So let me walk you through the steps required to make the fonts black and thus crisp and clear. After me, fellow nerds and enterprising techies.

Step 1: Create a copy of the default system theme

Step one is to copy the default theme (Ambiant MATE) from /usr/share/themes into your home directory, into the hidden folder .themes (needs to be created, if it does not exist). This will allow you to make safe changes, and if anything goes wrong, you can always revert to the original system theme, or start over.

mkdir -p ~/.themes
cp -r /usr/share/themes/Ambiant-MATE ~/.themes/Ambiant-"new name"

Let's call it MOTE, so the copy command becomes:

cp -r /usr/share/themes/Ambiant-MATE ~/.themes/Ambient-MOTE

Theme contents

The structure of the theme is very similar to Gnome 3. What we need is a file called gtk-main.css inside the gtk-3.0 folder. Open this file in a text editor:

pluma ~/.themes/Ambiant-MOTE/gtk-3.0/gtk-main.css

This file will have a number of @define-color clauses listed at the top, including a variable called text_color. This is what we want to edit, from the default gray color #3C3C3C to #000000. Easier than what I showed you for Xfce, Cinnamon or Gnome in the past, as this is a bit tidier.

/*default color scheme*/
@define-color bg_color #f2f1f0;
@define-color fg_color #4c4c4c;
@define-color base_color #ffffff;
@define-color text_color #3c3c3c;
@define-color selected_bg_color #87a556;
...

Gtk colors

All sorts of colors right there. Text is what we want - line 5.

Step 2: Change the theme index file

But we're not done. We also need to edit the theme index so we can distinguish it from our default theme. At the moment, both are essentially the same, even though they have different contents. Open the index.theme file in a text editor:

pluma ~/.themes/Ambiant-MOTE/index.theme

The contents of this file will be as follows:

[Desktop Entry]
Type=X-GNOME-Metatheme
Name=Ambiant-MATE
Comment=Ambiant MATE theme
Encoding=UTF-8

[X-GNOME-Metatheme]
GtkTheme=Ambiant-MATE
MetacityTheme=Ambiant-MATE
IconTheme=Ambiant-MATE
CursorTheme=mate
CursorSize=24
ButtonLayout=menu:minimize,maximize,close

You need to change a few small entries to reflect your new theme - MOTE. Specifically, Name, optional Comment, GtkTheme, and Metacity Theme. The rest won't affect the theme itself per se.

[Desktop Entry]
Type=X-GNOME-Metatheme
Name=Ambiant-MOTE
Comment=Ambiant MOTE theme
Encoding=UTF-8

[X-GNOME-Metatheme]
GtkTheme=Ambiant-MOTE
MetacityTheme=Ambiant-MOTE
IconTheme=Ambiant-MATE
CursorTheme=mate
CursorSize=24
ButtonLayout=menu:minimize,maximize,close

New font color in action

Let's load the theme:

Load new theme

And we can see the difference now - so much easier on the eyes:

Theme, edited

Font color

Default on the left, pure black font on the right.

Conclusion

And that's all there is to it. Funnily, of all the different problems that affect the Linux desktop space, fonts seem to be the most enduring one. This is something that just a tiny percentage of distros does well. The rest, I can't even begin to fathom the ergonomic considerations that went into the color palette.

Anyway, this guide gives you the tools to tweak any theme you like - and any aspect thereof, on a range of desktops. We focused on MATE, but the exact same process is valid for all the other environments I mentioned. It would be nice if an optional toggle is made available through the UI, so people can comfortably make the change without hacking CSS files. Well, that would be all for this little howto. Take care.

Cheers.