Google-chrome – Powerline Patched Fonts on OSX 10.9.3 – iTerm2 & Chrome

fontconfiggoogle-chromeiterm2powerline-networking

I'm looking for a working solution for rendering powerline characters on OSX in iTerm2 and Chrome. There's a lot of documentation around I've attempted to use several methods, none seem to work correctly so far (though prepatched fonts with fontbook partially works). Details included below.

  1. Is there a working method for getting the powerline glyphs to render correctly in iTerm2 on OSX 10.9.3?
  2. Should the powerline glyphs be rendering correctly in web pages? Any idea why they are not and how I can fix it?

How does the rendering of these characters work (at a system/application level)? Does it differ from application to application? In chrome, if the current font does not contain bindings for the glyphs, will chrome attempt to find the bindings in another font present on the system and use those? Is there any way to provide bindings for this unicode characters at a system level so that they will render using that font, regardless of the font that is being used?

Unicode Private Area Characters

If I understand the way powerline-compatible patched fonts work, they bind scalable graphics to specific values in the unicode private use area:

U+E0A0     Version control branch
U+E0A1     LN (line) symbol
U+E0A2     Closed padlock
U+E0B0     Rightwards black arrowhead
U+E0B1     Rightwards arrowhead
U+E0B2     Leftwards black arrowhead
U+E0B3     Leftwards arrowhead

To test the glyphs in a terminal, I've read that this should work:

echo -e "\ue0a0\ue0a1\ue0a2\ue0b0\ue0b1\ue0b2\ue0b3"

However it does not work for me (OSX 10.9.3, iTerm2, zsh) even with a powerline-patched font installed and iTerm2 configured to use one of those fonts.

I've tried several methods for installing the patched fonts:

FontBook & Prepatched Fonts

I downloaded the fonts from Localtog/powerline-fonts and installed them using FontBook. On same pages, some of the glyphs render but others do not. On other pages, none of the glyphs render:

Agnoster Theme
(source: staticflickr.com)

Powerline Documentation
(source: staticflickr.com)

In iTerm2 (this happens with all of the powerline fonts I've tested), some of the characters render, but others do not:

iTerm2 & zsh
(source: staticflickr.com)

In macvim (terminal) with vim-airline installed, some of the characters render, but some render incorrectly:

vim-airline
(source: staticflickr.com)

Fontconfig

I uninstalled all the powerline-patched fonts, installed fontconfig with homebrew, installed the powerline font, and rebuilt the font cache:

wget -P ~/.fonts/ https://github.com/Lokaltog/powerline/raw/develop/font/PowerlineSymbols.otf
wget -P ~/.config/fontconfig/conf.d/ https://github.com/Lokaltog/powerline/raw/develop/font/10-powerline-symbols.conf
fc-cache -vf ~/.fonts

The font was detected and fontconfig said it was installed, however it did not appear in FontBook and I was unable to select it in iTerm2.

After running this, I removed the fonts, reran fc-cache, and uninstalled fontconfig.

I am currently using the prepatched fonts installed in fontbook, which partially work, but I'm hoping someone can help me understand the issue a little bit better so I can find a working solution.

Update

This method seems to make everything work in iTerm2, though I am still unsure about chrome/system rendering issues.

FontForge

Install fontforge with python bindings:

brew install fontforge --with-python

Install powerline-fontpatcher:

mkdir -p ~/.local/src
git clone https://github.com/Lokaltog/powerline-fontpatcher.git ~/.local/src/powerline-fontpatcher
cd ~/.local/src/powerline-fontpatcher && python setup.py install && cd
export powerline_symbols=~/.local/src/powerline-fontpatcher/fonts/powerline-symbols.sfd

Download, patch & install font:

wget http://sourceforge.net/projects/sourcecodepro.adobe/files/SourceCodePro_FontsOnly-1.017.zip
unzip SourceCodePro_FontsOnly-1.017.zip

find SourceCodePro_FontsOnly-1.017/TTF -name \*.ttf -exec powerline-fontpatcher --source-font=$powerline_symbols --no-rename {} \;
mv *.ttf /Library/Fonts

Best Answer

Just install Input Mono font, comes with full support to powerline.

In order the following to work, Input Mono font must be version 1.1. You can check the font version by going to Font Book → View → Show Font Info, and look at the version number.

With Terminal.app works out of the box. Just select the font and you are ready.

With iTerm2, you have to modify a couple of things:

  • Go to Preferences → Profiles → Text and uncheck `Use a different font for non-ASCII text.
  • Just above, click on Change Font and select Input Mono. Additionally you have to change Character Spacing → Vertical to 110%. Seems that Terminal and iTerm2 render character spacing in a different way.