Custom kerning of an existing typeface?

Question

I'm a designer working with developers to create a mobile app. A central part of the app involves showing the number "100" as a central element of focus. Unfortunately, the font we're using has extremely wide kerning after the character "1", making it look more like "1 00".

Tighter tracking would be easy to apply, except that the kerning is fine on most other character pairs so everything would be too tight.

Is there a way to edit the font we've already licensed to improve the kerning? We are using Avenir, so I'm surprised this is even an issue with such a widely used typeface.

Answer 1

The issue isn't kerning, it's the width of the figures. Avenir (at least the version I have) uses tabular figures as opposed to proportional figures—which essentially means the figures are monospaced, giving you more space around the "1".

A comparison of proportional vs tabular figures:

See fonts.com — Proportional vs. Tabular Figures for more information.

You could fix the issue yourself in any font editor by simply changing the glyph widths. Font editors aren't the easiest programs to use if you don't know what you're doing so that may or may not be a reasonable solution.

FontForge is a free and open source font editor if you want to try your luck with a font editor.

Glyphs is another (although not free and Mac only) arguably more user-friendly font editor, there is a "mini" version that is more than enough to do what you need and you can download a trial version with no limitations.

Other than editing the font yourself in a font editor the easiest solution is either to find a version of the font that has proportional figures (I believe Avenir Next does but I may be mistaken) or kern the figures manually in the app (in iOS for example you can adjust kerning with an NSAttributedString).