I recently found our that some PNG files render a slightly different shade of color in Safari. (I think this is because Safari can't render PNG Gamma channel properly or what).

How do I export the PNG images so that they work perfectly fine throughout all the browsers. (preferable using Adobe Photoshop)


See this thread from the Apple support, but Safari uses the monitor's colorspace, which is different than most browsers, which only use sRGB. Hopefully the article will have some good information for you.

  • 1
    I like this but it goes more off towards from graphic design to the technical part. Another workaround I found was editing PNG chunks and removing the gamma. Looking if there is a solution within photoshop or something like that. – Atif Jan 5 '11 at 18:02

Your best bet would be to use the Save for Web & Devices... option. It's Photoshop's preferred method for exporting for web. That being said, the appearance of color on a website is always at the mercy of the user's screen calibration.


The slightly different shade is caused by browser applying gamma correction to colors in PNG, but not to any other colors.

To work around it:

  1. Save image as sRGB with gamma 2.2 (that's the default in almost all programs, so if you don't have config options for it, you don't have to do anything).
  2. Use image optimizer to strip gamma information from the file (that prevents browsers from trying to "correct" the file).

You'll find more information about cross-browser compatibility in PNG that works article.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.