Font smoothing in Google Chrome

Question

I'm trying to turn my icons into font glyphs.

Now, the problem is antialiasing of the font in Google Chrome on Windows 7 (it looks good on OS X). I took two shots, where on the first one you can see the desired behaviour, as seen on Firefox/Windows 7 and all the other browsers, except Google Chrome, which is the second shot. Is that problem in font itself? Or is it because of system settings? Is it in CSS settings?

Firefox 12 Windows 7

Google Chrome 18 Windows 7

The most problematic parts are highlighted with red.

Answer 1

Using text-shadow helps a little, try adding a little bit of shadow with 4-6 pixels of blur. Play around with it and you may find the "sweet spot." Some font sizes also seem to be more problematic than others, try taking it up or down a pixel or two and see if that helps. I'm tilting at this particular windmill with Google right now and hoping I can get someone's attention. In this image, the top example is IE9, the bottom example is Google Chrome (both Windows 7). https://twitter.com/#!/tacomamama/status/197397136470589440/photo/1

Answer 2

Use CUFON instead of @font-face it's a better option as per the rendering font in windows because CUFON put the font in canvas & it's look smooth in windows.