1

On http://www.everymeadows.com/, the header-banner "Every Meadows on Sunset Lake" has a background color that should match the adjacent light-orange background.

On Google Chrome for OS X, the backgrounds match perfectly. On Safari and Firefox for OS X, the orange in the image is noticably darker than the CSS background.

What could be the cause of this inconsistency?

Chrome Firefox

Jake
  • 4,829
  • 2
  • 33
  • 44
  • 1
    Some images can have color profiles/spaces associated with them. Maybe that is the reason. See this question - http://stackoverflow.com/questions/817727/converting-jpeg-colorspace-adobe-rgb-to-srgb-on-linux – tathagata Feb 26 '11 at 19:05
  • 1
    it IS the reason - chrome doesn't color manage by profiles embedded in images, even though it's a Webkit browser. FF and Safari do. IE doesn't. – jpea Feb 26 '11 at 19:23
  • 1
    And to get rid of it, when you save-for-web out of photoshop (or whatever program), don't convert it to a profile (like sRGB). – jpea Feb 26 '11 at 19:23

1 Answers1

2

The difference in color is due to color profiles. Some browsers support images with color profiles, others don't.

The image on everymeadows is probably saved as 'Calibrated RGB Colorspace', which is default when you choose Save As in photoshop. (See file info -> more info under OSX to view the profile name of an image).

When you Save For Web in Photoshop, a web friendly sRGB profile will be automatically applied. You should not have any color problems anymore after that.

red
  • 833
  • 1
  • 7
  • 13