My PNG images look like they are changing colors on me


I’m using Adobe Photoshop CS5, Panic Coda, and Firefox, MSIE6, and MSIE7 to test. This problem is visible in all 3 browsers.

I have a few foreground images which live in top of a DIV background image. The foreground images (of a title text graphic and of a web page screengrab) have background colors that should blend with the DIV background image, but the background image looks a bit lighter than the foreground images.

All of the images were made from a Photoshop comp using the “save for web & devices” option. I saved them all as PNG files 24-bit, no alpha. As far as I can tell, they all use sRGB color, but I’m not sure how to check that.

Here is a screengrab of the issue:

Any help is appreciated!



My Crystal Ball, isn’t that good; like I said it would help if I could actually reach them. :wink:

But from what you have said it sounds like either transparency or something like dithering is occurring as you reduced the colour depth to 256 and the steps lost their smoothness.

It changes color on me every single time I save them at PNG 8-Bit, but it has never happened to me on 24-bit

Do you have an actual test page to look at it is clear they are “different colours” but I cannot tell what is physically happening on the page from a screen-shot alone.

I don’t see any wrong too.
Have you set the the color?
Usually when you make new file, you have to set the color.
I think you must use ordinary RGB, because it will be accepted in all monitor.

I can’t see any color demarcation in the center area of dark color; it looks like a smooth, subtle gradient on both my “light” and “darker” displays. I do see the borders as different (pinkish and yellow) but your arrows seem to be pointing to a demarcation of color that I can’t see.

That’s how it looks from here.