Last Updated: February 25, 2016
·
2.951K
· magalhini

Unwanted bold-ish weight on MacOS Webkit typefaces

Having recently switched from a PC working environment to a Mac, one thing that was driving me nuts was the extra bold feeling that Chrome and Safari were applying to every typeface, compared to Firefox and every Windows' browser counterpart.

The trick is to apply the following webkit CSS3 property:

-webkit-font-smoothing: antialiased;

Default:

Picture

Apparently this does the trick. You can compare the previous/after screenshots, both taken on Chrome 20.1132 / Mac OSX with the Minion Pro typeface.

With font-smoothing:

Picture

1 Response
Add your response

This is much better than my tip on the same issue. Well-documented with cool image samples. Well done.

over 1 year ago ·