CSS System Fonts on Linux 2018

I’ve been working on CSS native font stacks as way of delivering the best reading experience in the shortest amount of page-load time. Apple and Windows are mostly straightforward. But what about Linux? To find out, I fired up the default desktop versions of:

• Fedora 28 (pre-release)
• Ubuntu 18.04 (pre-release)
• Mint Linux 18.3
• Elementary.io (early 2018)

and the ran the following and analyzed the results.

fc-list -f '%{family[0]}\n' | sort -u

What’s Installed

These generic fonts were installed on all systems:

• Nimbus Roman, FreeSerif, Liberation Serif are all replicas of Times New Roman.
• Nimbus Sans, FreeSans, Liberation Sans are all replicas of Helvetica.
• Nimbus Mono and FreeMono are clones of Courier New.
• DejaVu Sans, DejaVu Serif, DejaVu Mono are often the default browser font. They are much larger in width and height than the ones listed previously.

There is little need to ever use these in CSS since they are the default. Beyond that are few cross-system Linux fonts. However are some are definitely useful. Below is a table of the most interesting additional fonts:

Notes:

• Liberation Mono is installed on all tested linux systems. It’s metric-compatible with Courier New but looks like Apple Menlo or the DejaVu Mono (above). It’s also about the same size a Consolas on windows.
• URW Palladio L is a clone of Pallatino, which is a system font on macOS and Windows. While definitely usable on the screen, it is maybe most useful for printing.
• Bitstream Charter is the preginitor of Georgia. Is it is also a system font on macOS. Practical Typography has a nice history of this font as well.
• Ubuntu (the typeface) and Ubuntu Mono are the OS system fonts for Ubuntu and Ubuntu-like systems. The monospace version is more dense and smaller than other monospace fonts.
• Noto Mono is installed on all Ubuntu systems. Oddly it’s a google font, but not hosted on fonts.google.com.
• Caladea is a clone of the Microsoft font Cambria.
• Cantarell is the OS System font for GNOME/Fedora.
• Montserrat is very nice sans-serif font for Fedora. It’s used for Fedora marketing.
• Oddly, Noto Serif is not on Ubuntu 18.04 but is available on the Mint and Elementary (which are based on ubuntu or debian).
• And yes, you read the table correctly, only the latest Ubuntu and Fedora have color emoji. Before that it’s only black-and-white versions.

Most of these fonts, if not already present, can be installed by the end-user using the package manager of the OS. In addition, Ubuntu, Noto Serif, Cambria, Cantarell, and Montserrat are are all hosted as web fonts on fonts.google.com.

Conclusions and Opinions

The good news is there are good system fonts for monospace. Adding Liberation Mono to your font stack will prevent some horrible Courier New clone from being used on Linux. Since it’s the about the same size as the system fonts on Windows and macOS, it should blend in well. Noto Mono is a good alternative as well.

For sans-serif fonts, the choice is less obvious. DejaVu Sans is often a default but I find it a bit large and clunky. Liberation Sans is option, although not that exciting. The Ubuntu font is quite distinctive, and I find Cantarell questionable, but they might work for your stacks. Montserrat is very nice, but is Fedora only.

For serif typefaces, the choices are slim. Fortunately Bitstream Charter is a good substitute for Georgia on Ubuntu systems. And Caladea on Fedora systems is a good alternative.

And emoji. Since Ubuntu 18.04 added Noto Color Emoji it’s expected the respins will add it shortly as well. For Fedora, while Bug 1496761 makes it very clear Fedora will not be using Noto for emoji, my pre-release version has it installed. Either way, it makes sense to add this to your color emoji stack.

There is one other choice. Given the low volume of traffic, the limited choices for system fonts, and diversity of distributions, perhaps using a web font as fall back is the best option for Linux.