Type Rendering Mix

Type Rendering Mix is useful in many situations, especially when it comes to “thin” font weight in OS X. Due to the way the Core Text rasterizer works, fonts will look heavier on OS X and iOS than on other platforms.

Designers often attempt to create consistent font rendering by applying -webkit-font-smoothing: antialiased and -moz-osx-font-smoothing: grayscale. This will make type appear lighter, but it also disables sub-pixel anti-aliasing which results in text looking more blurred.

Using Type Rendering Mix you can instead decrease the font weight for browsers that use Core Text to render text. But another use case for Type Rendering Mix is to disable web fonts when no anti-aliasing is applied. You can also disable web fonts if you know that they render badly on some text rasterizers.

Browser support

Type Rendering Mix supports IE6+, Chrome, Firefox, Safari, Opera, Android 2.2+, and iOS 4.2+. Other browsers may work, but are not extensively tested.

Type Rendering Mix


Article Navigation

Wait .. there's more!

Online CV Jan Rajtoral