Joe Maller.com

Adobe’s color shifting PNGs

After some tests, I’m convinced that Adobe’s CS2 apps are incapable of saving PNGs without shifting colors. I tried every combination of Color Management settings as well as input color spaces. No matter what I tried, the designated RGB values I started with were getting shifted when saved as PNG. Saving the same documents as GIFs output the correct colors.

I posted the following to Adobe’s Forums, including my workaround solution:

>Wasted a very frustrating hour with this today. There is definitely a color shift in PNG output that seems consistent across several CS2 apps. I first hit the bug using Illustrator’s
“Save for Office…”, which saves a hi-res PNG of the current Illustrator doc. After that failed a few dozen times (I tried a variety of color management settings, despite being hardware calibrated), I switched to Illustrator’s “Save for Web…” option. This produced exactly the same shift. Identical problems in Photoshop, though lesser when saving directly to PNG and skipping “Save for Web”.

>My solution was to save the Illustrator file as a GIF, then open that in the OS X Preview app, then resave as a PNG. Worked perfectly with zero color shift.

>This is Adobe’s bug, not a problem with the PNG format.


10 Responses to “Adobe’s color shifting PNGs” Comments Feed for Adobe’s color shifting PNGs

  • Hmm. What application are you viewing the resulting PNGs in? Is it a web browser? Browsers inconsistently apply the gamma information saved in a PNG which makes for a slight color shift that is especially noticeable when the color in a PNG is supposed to match up with a background color.

    The Sad Story of PNG Gamma “Correction”
    http://hsivonen.iki.fi/png-gamma/

    I’ve been using a tool called PNG crush to strip all profile info from PNG files, which gets rid of the color shift and also makes them slightly smaller.
    http://pmt.sourceforge.net/pngcrush/

    The command when run inside a directory of PNGs you want to update, where you have also created a directory called “outputdirectory” where the updated files will be saved;
    pngcrush -d outputdirectory/ -rem gAMA -rem cHRM -rem iCCP -rem sRGB *.png

    This is the solution that I use to prepare PNGs created with Adobe CS2 apps for the web. Sorry if this has nothing to do with your problem.

  • Thanks for alerting me to this. I’ll have to try these workarounds.

    Is this on Intel or PPC, by the way? I’ve never noticed a difference but I admit to not having looked too closely at the resulting PNG.

    Seems like if this is true, might be a good case for an Automator Action.

  • This reminds me of the days where imageready would always shift the color output of a .gif to something un-web-safe (even if the original source was web-safe to begin with). I used to create banner ads with Intel logos on them. Intel’s brand cops would reject the ads because of this color shift. Took me a month to figure out.

    It turned out that Photoshop/ImageReady’s color settings were defaulted to color correct for print output. It was a tedious process to tweak the settings to NOT force this color shift upon my output. Even though I supposedly was being given the lattitude to create artwork for both print and online in the same app, I could not do so if I actually CARED about the quality of the actual output.

    I suspect that the solution you need will be found in photoshop’s edit/color settings. Check to see that you do not have “North America General Purpose” selected (that’s the default…same problem as I describe above). Try “color management off” as well as internet-only settings. With “color management off”, you should get a mathematical experience (as opposed to a perceptual one). It might not look right on your monitor, but it will deliver precisely what you tell it to create. It shouldn’t “force” any kind of correction onto the file.

    Of course, you are way more advanced than I’ll ever be, but I figured I’d reply. The solution in my case was anything but intuitive. Hope this solves it. Just curious: what do you use PNG’s for?

    -patrick

  • And in my case, the solution was given to me by an actual Adobe ImageReady engineer who happened to be trolling the support boards looking for color bugs. You might post a message shouting out to any of the product engineers who might be reading.

  • Another possible low-tech solution for a high-tech problem: Run the files through debabelizer pro?

  • I noticed this a while back. In Save for Web, I chose a web-safe color for the background, the background saved was visibly off when seen on a web browser with the same web-safe color as a background. Same image settings saved as GIF – no problem, so I don’t think it’s the color settings or both would be affected. I think it’s a programming error like: start counting at 0 instead of 1 bug. (just guessing). Glad to hear it’s not just me!

  • The problem is called PNG gamma problem. IE renders PNG files wrong when PNG is saved with gamma information. The solution is to remove the gamma information from the PNG.

  • I have this problem even with jpeg, so I switch off colour management that was meant for prints (edit > colour settings > colour management off)

    Colour management sucks. I find that it not only mess up web graphics, it also mess up printout unless you have a correct printer profile, else it’s better not to have any profile at all than to have profile that push colours to the extremes.

    Adobe should remove this gamma information when we “save for web” anyway. Now they are going to have colour profile for jpeg soon. We will have more headache soon as well.

  • We have been having troubles with a skins package and getting the colors correct. The software company recommended using .png for the logo area of all the skins. Not using .png before I was getting very frustrated.

    Downloaded the “win32” pngcrush.exe and worked like a dream. We have to follow strick color standards with our logos, this was exactly what we needed.

    As we were doing a lot of images we used this method, created a in and out folder:

    pngcrush -rem gAMA -rem cHRM -rem iCCP -rem sRGB in/myfile.png out/myfile.png

    On PC the folder set-up before running command:
    C:\PNG Crush\pngcrush.exe
    C:\PNG Crush\in\myfile.png
    C:\PNG Crush\out\

    On PC after running command:
    C:\PNG Crush\pngcrush.exe
    C:\PNG Crush\in\myfile.png
    C:\PNG Crush\out\myfile.png

  • Jeremy’s command line solution with PNG Crush just totally saved me a huge amount of time and frustration. Thanks for this helpful comment thread.

    I feel so much better knowing my Adobe CS2 PNG’s won’t keep coming out looking completely different than intended color. Just wish I hadn’t already wasted two hours, thinking it was MY color calibration or settings. Pfft. Adobe…shame!

    PNG CRUSH — FTW.

Leave a Reply to Leon