Gfilui

I've upgraded from 17.10 to 18.04 and was hoping to have better emoji support. The results are that Chrome (66) is still using the old black and white emoji font, and Firefox (59) is managing to show some color emoji but not others. I took some advice to install the font EmojiOne but that didn't seem to help 😓

Screenshots from the emoji demo page at http://eosrei.github.io/emojione-color-font/full-demo.html :

Chrome:

Firefox:

On Ubuntu 18.04+ you can now simply install a single package: fonts-noto-color-emoji. After that, restart Chrome and it will take effect. No need for creating a manual font configuration.

^{This package is supposed to be installed on the regular Ubuntu 18.04+ desktop flavor (on a 'Recommended' level of dependency - check for yourself with apt rdepends fonts-noto-color-emoji). Some other flavors like Kubuntu (KDE) don't have this by default and require you to install it manually.}

I fixed it - I had to follow these instructions from 2016 😧 I had to create ~/.config/fontconfig/conf.d/01-emoji.conf with the following text:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE fontconfig SYSTEM "fonts.dtd">
<fontconfig>
 <alias>
 <family>serif</family>
 <prefer>
 <family>Noto Color Emoji</family>
 </prefer>
 </alias>
 <alias>
 <family>sans-serif</family>
 <prefer>
 <family>Noto Color Emoji</family>
 </prefer>
 </alias>
 <alias>
 <family>monospace</family>
 <prefer>
 <family>Noto Color Emoji</family>
 </prefer>
 </alias>
</fontconfig>

The bit in the original instructions about installing Noto font was unnecessary since it's installed as part of 18.04 by default.

Then run:

fc-cache -f -v

On the next restart, Chrome has color emoji.

Don't use that demo page to test color emoji. That page only demonstrates the EmojiOne font which isn't installed by default in Ubuntu (although Firefox uses a variation of it).

Instead use https://unicode.org/emoji/charts/full-emoji-list.html

Look at the Browser column. In default Ubuntu, it should mostly match the Google column. (Except for the Browser column, all the other columns are just .png icons). When I tested today, the Google column is just a bit out of date as Google has made some changes to some of their emoji that haven't been incorporated into the website. (For instance, the hamburger has cheese on top of the burger.)