Improving Font Rendering in Ubuntu

I don't really know much about fonts, but I still love them; particularly monospaced fonts for writing code. I've tried a lot of monospace fonts over the years, including two of my past favorites: Consolas and, more recently, DejaVu Sans Mono. Great fonts both.

However, I'm a huge fan of Damien Guard's Envy Code R font. It's an absolutely beautiful font all around and Damien has put a lot of effort into making it very readable on screen with good hinting. It just looks gorgeous on Visual Studio, particularly thanks to the italics-as-bold trick Damien came up with. (Which reminds me that I really owe Damien at least a few beers if we ever meet!)

Unfortunately, every time I tried to use Envy Code R  on one of my Ubuntu machines, the result was not what I expected; for whatever reason it just didn't look as good as it did on Windows. DejaVu Sans Mono, however, looked good on both platforms, so I was using that as my default font for GVim.

Here's how Envy Code R looked like in GVim under Ubuntu, contrasted against the Windows version (with ClearType enabled):

Ubuntu	Windows

Both images were taken using the Envy Code R at size 13. You should be able to spot several differences right away:

• The text in normal weight (non-bold) looks a bit thinner on Ubuntu
• Some characters really show a significant difference in how they are rendered. The 'm' in particular looks very thin and aligned too much to the left.
• The quotes are a lot harder to see, especially in comments where there is less contrast between the foreground and background colors.

I pinged Damien to ask if he knew what this might be related to. He pointed out that every Operating System had a different way of rendering fonts so it was natural for them to look a bit different on each one. I was, of course, aware of this and even remembered that Jeff Atwood had touched on this topic in the past. Damien also suggested I verified that my Ubuntu installation had sub-pixel hinting enabled.

I went ahead and checked it one more time, and the font settings clearly showed sub-pixel rendering and full hinting enabled:

Damien's comment regarding the settings made me remember something: I use Xubuntu, which uses XFCE as the desktop manager. However, I believe GVim is written on top of GTK+ (Gnome) and wondered if this had anything to do with it.

I went ahead and checked the Gnome settings just in case, and they did not have sub-pixel smoothing enabled; only the "best appearance" setting was checked. So I went ahead and changed the Gnome settings as well, restarted the machine (just in case) and.... no dice. The font still didn't look right.

Solving the Puzzle

After a couple of days of tweaking options here and there, I finally found a combination of settings that allowed Envy Code R to be rendered on Ubuntu a lot better for my taste.

Here's the catch: I had to enable sub-pixel hinting (setting it to RGB), but change the hinting setting from Full to Slight. This makes some fonts look a little bit more fuzzy, but it makes both Envy Code and DejaVu Sans Mono look great (or at least a heck of a lot better), which is what I wanted all along:

Turns out that the XFCE vs. Gnome thing wasn't really important after all. In the end, here's how I got it to work:

1. Open the XFCE Settings Manager, and then launch the User Interface applet.
2. Make sure that the "Use Hinting" option is set to "Slight" and that the "Use sub-pixel hinting" option is set to "RGB" (or whatever is appropriate to your screen).
3. If you have any GVim instances open (or other GTK+ based apps, like gnome-terminal), then close and restart them. Otherwise, they won't completely pick up the changed settings.

If you're using Gnome as your desktop, you can get the same using the Gnome appearance applet:

1. Run the Gnome settings UI by launching the gnome-appearance-properties application from a terminal window. I don't remember where this is located in the UI, but should be easy to get to.
2. Go to the Fonts tab and then click the Details Button. In here, set the Smoothing option to "Subpixel (LCDs)" and the Hinting option to "Slight". Make sure the subpixel order option matches your screen.
   
   
3. Apply all the settings.

Now I can enjoy Envy Code R on Linux as well as Windows :-D.