Ask Different is a question and answer site for power users of Apple hardware and software. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I realised that on my 13" MacBook Pro (mid 2012), Google Chrome renders fonts with opacity in a different way than other browsers.

This is what it looks like in Chrome:

Google Chrome on OS X

Notice that the second heading is much thinner that the first one. This is the same code in Firefox.

Firefox on OS X

In Firefox it's correct.

This looks very weird especially with fade in/out effects...

I have no idea what's wrong. When I had my old 15" MacBook Pro (late 2008) it was correct in all browser, so maybe it has something to do with rendering using GPU?

By the way, this is the test code

share|improve this question
Did you test it outside JSFiddle? Chrome rendered them normally when I copied the code to a local HTML file. – user495470 Sep 5 '12 at 9:40
Yes, I made that JSFiddle just to make a small "demo" :). – Martin Sep 5 '12 at 10:02
This is probably because Chrome renders its own window and doesn’t use OS X default programming practices. Just a theory. – duci9y Sep 5 '12 at 12:31
Check this answer to another question: – kobame Sep 5 '12 at 15:53
I tried this but it unfortunately didn't help. – Martin Sep 6 '12 at 10:19

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Browse other questions tagged or ask your own question.