Saturation Differences in Photoshop vs. Firefox Browser

[Rich54]

In a recent free edit request (Remove Hair Strand, posted by Flowers), she liked my edit but asked me to restore the original image vibrancy. I did not make any image adjustments at all, yet when I view my edit in PSG compared to her original post, I see obvious color differences.

Here's a comparison of screenshots for what I'm seeing in Photoshop, Firefox, and Microsoft Edge browser. These are all the OP's original image, before any edits. The luminosity is identical for all three. But when I isolate the saturation component, Photoshop and Microsoft are identical, but Firefox is noticeably more saturated.

I had this issue years ago and corrected it with settings in Firefox, but it has somehow come back. But before I start tweaking Firefox, I'm not sure which of these images is accurate.

Could somebody please look at the Photoshop and Firefox images here and tell me which one—on your own computer—more closely matches what the OP originally posted?

Thanks
Rich

 

[IamSam]

Hey Rich. I'm not sure if this is what you're asking, but your FF (middle) image most closely matches my PS (original OP's image) image (top). Your Ps and MS Edge images look slightly more desatted.

 

[Rich54]

your FF (middle) image most closely matches my PS (original OP's image) image (top). Your Ps and MS Edge images look slightly more desatted.

Thanks. This helps me isolate my problem.

It seems that when I view an image in PSG using Firefox, I am seeing accurate colors. But for some reason, if I save the file and open it in Photoshop, it immediately becomes less saturated. So now I've got to figure out why that is happening.

 

[thebestcpu]

Hi @Rich54
The OPs image does not have an embedded profile. So the browser will assume it is in sRGB, how it is interpretted in your PS depends on your settings and if you put warnings in to flag you.
Just a thought
John Wheeler

 

[Rich54]

Hi @Rich54
The OPs image does not have an embedded profile. So the browser will assume it is in sRGB, how it is interpretted in your PS depends on your settings and if you put warnings in to flag you.
Just a thought
John Wheeler

John,
Here are my current color settings. I guess the first thing I should do is to check the boxes to activate the warnings. Are there any other settings here that you think I should change?

For this particular image (the hair strand), if I change it in Photoshop to Adobe98, the resulting colors match the OP's image in PSG almost perfectly. So maybe my problem only happens where the original image has no embedded profile and Photoshop isn't sure what to do with it.

 

[IamSam]

Mine. They appear to be the same as yours.

 

[thebestcpu]

Hi Rich
Here is some info
The original image supplied by the OP does not have an embedded profile. It does have an metadata identifier saying its RGB
That is the same for your first image you posted
That is the same for you browser image comparison you posted
That is also the same as the second image you posted on the OPs thread

When you edit in Photoshop, when the image is left as untagged (which would happen in your configuration) it will act as if the image is being editing in your working space sRGB yet it does not tag the image. If you are taking screen shots to share with us, that did not have any profile tagged with it (e.g. the display profile) so there is not way to know if what I see is accurate. I can only see differences among the three images.

Here is what browsers are supposed to do when the image does not have an embedded profile:

Default Behavior in Major Browsers​

1. Chrome (and Chromium-based browsers like Edge, Brave, Opera)
   
   • Assumes the image is in sRGB if no profile is embedded.
   • Uses ICC v2 and v4 profiles for tagged images.
   • Color management is generally enabled for images, CSS, and video, but handling varies by OS.
2. Firefox
   
   • Uses full color management if gfx.color_management.mode = 1 (default is 2, which manages only tagged images).
   • Assumes sRGB for untagged images unless manually configured.
   • Can be fine-tuned in about:config settings.
3. Safari (Mac & iOS)
   
   • Fully color-managed.
   • Assumes sRGB for untagged images.
   • Uses display profile for rendering.
4. Edge (Chromium-based)
   
   • Behaves like Chrome, assuming sRGB for untagged images.
   • Supports ICC v2 and v4 profiles.

So untagged should behave as if it were sRGB except that in firefox it depends on its configuration settings:




The top one should be bland
The second one should be set to True
The third one should be set to "1." Note the default is #2, which means it's not managing the color. That means it could send the color numbers directly to the monitor (not positive)
There is another option not shown to support version 2 and version 4 ICC profiles that should be set to true as well (though not too many images use version 4)

The key to consistency is ensuring a profile is applied to the image when it enters Photoshop. Set the warning buttons so that when an untagged image comes in, you have options on what to set it for. Setting it to sRGB is a safe bet unless it comes across as the wrong color, and then you have to guess on the correct profile.
When you save, you need to ensure you are saving with an embedded profile attached - that is not happening. I think all save paths directly from Photoshop have that option. If you don't see that option, we need to track it down.

Doing all the above and then sharing the files with embedded profiles directly (not screenshots unless your screen capture includes your display profile) will allow us to see the correct colors of your images.

I bet that just doing the first steps of ensuring embedded profiles in all images will solve almost all the problems and make it a lot easier to track down any straggler issue.

Hope this helps
John Wheeler

 

[Rich54]

@IamSam and @thebestcpu

Thanks to both. I adjusted my Firefox settings and activated the Photoshop warnings. Now that I've confirmed that what I see on the screen in PSG is "correct", I can be alert to any differences after importing to Photoshop.