The -webkit-font-smoothing property does not work in Chrome

Question

I am trying to control the anti-glare compression of Google Chrome fonts (terrible) using the CSS -webkit-font-smoothing property, but this has absolutely no effect on the text.

 <div style="font-size: 42px"> <p style="-webkit-font-smoothing: subpixel-antialiased">This is a font test.</p> <p style="-webkit-font-smoothing: antialiased">This is a font test.</p> <p style="-webkit-font-smoothing: none">This is a font test.</p> </div> 

I compared pixels in Photoshop, and all three are exactly the same. Does Chrome no longer support this property?

Answer 1

https://productforums.google.com/forum/?fromgroups=#!topic/chrome/0vqp1bnkaoE

-webkit-font-smoothing no longer works. The Google Chrome team intentionally changed this behavior. It seems that font smoothing was not applied “correctly” on OSX in previous versions.

Answer 2

Well, you're right. Font smoothing is no longer supported. This is not in the new css standards. So there is no more font smoothing.! You can see the w3c standards here. http://www.w3.org/TR/WD-font/#font-smooth

Answer 3

If you use a browser or OS that does not have font rendering, this will not work, if you try -moz- -o- , Chrome works on -webkit- , it should be your browser.

Answer 4

It seems that for some (system?) Fonts there is a difference between your test cases:

 body { font-family: "HelveticaNeue-Light"; font-weight: 300; } 

http://jsfiddle.net/gN875/

Answer 5

Try this CSS:

 div { -webkit-text-stroke: 0.6px; } 

 <div style="font-size: 42px"> <p style="-webkit-font-smoothing: subpixel-antialiased">This is a font test.</p> <p style="-webkit-font-smoothing: antialiased">This is a font test.</p> <p style="-webkit-font-smoothing: none">This is a font test.</p> </div>