Ultralight Font Weight in Xcode Appears Too Thin

Question

My designs are made in Sketch with an Apple system font, Avenir Next Ultralight. Avenir Next Ultralight is also a system font from Apple in Xcode. When used in Xcode, the ultralight becomes much thinner than it is in Sketch or in any other application.

To make sure it isn't just this font, I tested Helvetica Neue Ultralight which was the default font for iOS 7. On Sketch with Sketch Mirror (simulator), the font looks just like iOS 7. On Xcode with the simulator hooked up to an iPhone, the font is once again, illegibly thin. I tested on my developer's mac+iphone and then on my mac+iphone and the results were the same. It seems strange that Apple's long running iOS font doesn't work in their main programming tool.

Avenir Ultralight in Xcode Simulator

Avenir Ultralight in Sketch Simulator

How do I fix this problem in Xcode to match my designs in the Sketch Simulator?

Answer 1

Instead of searching for why the font was too thin in Xcode (assuming Sketch was correct), I searched for why sketch fonts were too bold. There, I found my answer.

Open the preferences (menu bar: Sketch > Preferences) and under the canvas tab, untick the sub pixel rendering option.

Enabling sub-pixel anti-aliasing allows for accurate font rending on the Mac. However, iOS devices do not support sub-pixel anti-aliasing. For accurate rendering on the iPhone, disable this.