I will say before all that this will not always works, i have tested this with sans-serif
font and external fonts like open sans
Sometimes, when you use huge fonts, try to approximate to font-size:49px
and upper
This is a header text with a size of 48px (font-size:48px;
in the element that contains the text).
But, if you up the 48px to font-size:49px;
(and 50px, 60px, 80px, etc...), something interesting happens
The text automatically get smooth, and seems really good
If you are looking for small fonts, you can try this, but isn't very effective.
To the parent of the text, just apply the next css property: -webkit-backface-visibility: hidden;
You can transform something like this:
To this:
(the font is Kreon
)
Consider that when you are not putting that property, -webkit-backface-visibility: visible;
is inherit
But be careful, that practice will not give always good results, if you see carefully, Chrome just make the text look a little bit blurry.
-webkit-backface-visibility: hidden;
will works too when you transform a text in Chrome (with the -webkit-transform
property, that includes rotations, skews, etc)
Without -webkit-backface-visibility: hidden;
With -webkit-backface-visibility: hidden;
Well, I don't know why that practices works, but it does for me. Sorry for my weird english.