Skip to main content
I
ivframes
Inspiring
March 28, 2017
Answered

Oversaturated colors in browsers - color calibration issue

  • March 28, 2017
  • 3 replies
  • 10251 views

I think I have a problem with color management.

I calibrated both of my displays by DisplayCAL and Spyder. Colors seem to be correct. The program loads the profile(s) automatically at startup.

This my workflow:

1. Import RAW to LR. Tweak in LR.

2. Export image to PS using Prophoto RGB profile.

3. Final tweaking in PS, converting it to JPG with AdobeRGB profile.

4. Checking how the image looks in the Firefox or Chrome. It's always more saturated! Especially reds.

I can "emulate" the same browser-look in PS if I save the image to sRGB and then show MonitorRGB proof colors.

Why this happens? I'm using Windows 10, default profile is the same that DisplayCAL created. What should I do now?

Thanks.

This topic has been closed for replies.
Correct answer Benjamin Root

Never had that problem at my end with Chrome. Of course, I don't use a wide gamut display. You guys probably do and will need a fully color managed browser.

Standard displays are very close to sRGB, while wide gamut are close to Adobe RGB. The characteristics of Adobe RGB are less saturated, shall we say. Therefore, when the monitor translates the sRGB data as Adobe RGB the resul is over saturated, off color.

3 replies

D Fosse
Community Expert
D FosseCommunity Expert
Community Expert
March 29, 2017

All of this is what happens when you use a wide gamut monitor without full color management.

The color profile must be embedded. Remember that Save For Web and Export both strip the profile at default settings! The "include profile" box must be checked.

The whole Firefox UI will be oversaturated unless you set it to color management mode 1. This is a required setting with wide gamut displays! Enable v4 profiles while you're at it. This way Firefox will correctly handle anything you can throw at it, and always display correctly.

AFAIK Safari in later versions has adopted the Firefox mode 1 policy (they'd simply have to, with the recent DCI-P3 displays). So it should also work well. This is the Mac version - I think the Windows version still has the old behavior (haven't tested it in a while).

    postrophe
    postrophe
    Inspiring
    March 29, 2017

    Hi

    (I'm a Mac user) - MacBookPro retina -

    I just check a few sites that I manage ( old or new)  in different browsers ( Safari, Firefox, Chrome, Opera )

    The images were created in divers software and Mac OS, ( PS, IPhoto, Photos, and some other core mac software. )

    All images are consistent from the oririginal across my browsers. Also on my old PC laptop.

    Pierre

    D Fosse
    Community Expert
    D FosseCommunity Expert
    Community Expert
    March 29, 2017

    The question is what happens with a wide gamut display, when the old sRGB paradigm breaks down and doesn't work anymore.

    Then you must have full color management. You need an embedded color profile, you need a valid monitor profile, and a web browser that reads both and converts the data before going to screen.

    Even if you have a color managed browser - how does it deal with untagged images and graphic page elements? That's where the color management chain normally breaks down. There's nothing to convert from, and so no way to convert to. So the original numbers are just sent straight to the display uncorrected. That doesn't work on wide gamut, it gets oversaturated.

    This is the genius of Firefox mode 1, a strategy now adopted by Safari on Mac. It assigns sRGB if no profile is already there. This means the standard color management chain can operate again.

    But there's an added, little known benefit. It means that everything, even untagged material, is fully color managed in all situations. That's a fully color managed internet, ladies and gentlemen, and it's already here if you just flip the switch.

      Benjamin Root
      Benjamin Root
      Legend
      March 29, 2017

      For web use, unless you have a specific reason/goal, always use sRGB.

      Theresa J
      Community Expert
      Theresa JCommunity Expert
      Community Expert
      March 29, 2017

      Yeah but sRGB makes no difference. The entire browser is saturated.

        I
        ivframesAuthor
        Inspiring
        March 29, 2017

        Yeah, true. I see no difference in browser.

        The only difference between sRGB and AdobeRGB is when I use Proof Colors -> MonitorRGB in Photoshop. With sRGB image, I can see the same saturation as in the browser with proof turned on.

        Theresa J
        Community Expert
        Theresa JCommunity Expert
        Community Expert
        March 29, 2017

        I have the same exact problem. It happened after I calibrated my two monitors with an i1 display Pro. I did a bunch of research and then just gave up, and started using Safari. That is the only browser for me that doesn't destroy colors.

        Terms & ConditionsAccessibility statement
        Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices