I'm using a new MacBook Pro 15" with macOS 10.13.4 configured with the default Color LCD color profile. I'm doing some graphic design work and noticed that all colors in Chrome and Safari appear "washed out" when compared to Firefox. The latter has more saturated/vibrant colors. And this happens to native HTML/CSS elements (i.e. not images only).

Here's a screenshot of the SmashingMagazine homepage with the comparison (Chrome on the left, Firefox on the right). Notice how the colors are more vibrant in Firefox (right):

enter image description here

If I change my display's color profile to sRGB IEC61966-2.1, then both Chrome and Firefox look the same.

Why is this? Any help is greatly appreciated.

  • Colour management is a mine-field :/ Some browsers respect embedded profiles & some don't. The image you posted is in Display profile... which is not good. You should aim for sRGB if your intended target is web. Using your display profile in your workflow is not recommended. Calibrating your monitor would be a good start, rather than using generic profiling; otherwise you'll never know which was correct. As an example, let us know the intended RGB values of the top red bar.
    – Tetsujin
    Jun 14, 2018 at 7:20
  • @Tetsujin in my example screenshot the top red bar has a CSS background color of #d33a2c. This value is the same in both browsers, yet with the same display color profile (Color LCD), Chrome/Safari show the color differently from Firefox. Regardless of whether my display's color profile is calibrated or not, I would expect the same CSS hex color code to display the same in Chrome, Safari and Firefox. My question is, why isn't this the case? As far as I know, there is no color management (i.e. color profiles) for CSS.
    – Ralph
    Jun 14, 2018 at 15:41
  • It's not really regardless of your calibration & workflow.. it's probably because of it. I can't repro here on a calibrated setup. See i.stack.imgur.com/qdVpp.png captured from Safari left, Chrome right, with Digital colour meter floating on top. Colour is as you stated [within tolerance] on both, when viewed in sRGB. If I float the meter over that repro, which was screen-captured, cropped then saved via Photoshop then posted to imgur & viewed from Safari, it is still the right colour.
    – Tetsujin
    Jun 14, 2018 at 16:07
  • @Tetsujin do the colors look the same for you between Chrome and Firefox? Chrome and Safari look the same for me, so that's not the issue. The issue is that all colors on any webpage in Chrome and Safari (and even Preview app) appear highly faded compared to Firefox. So it looks like Firefox is doing something differently. Maybe my "Color LCD" color profile is messed up? Or my Macbook's screen is defective? If I change my display's color profile to "Apple RGB" or sRGB, then everything looks consistent across apps. But isn't Color LCD supposed to be the correct profile for a MBP screen?
    – Ralph
    Jun 15, 2018 at 3:55
  • Ugh, never usedFirefox before - absolutely miles off what it should be. No idea what they're doing to it. btw, the 'correct' profile for any screen is the one your colorimeter & software generates. The ones you get in the original list are guesstimates, no better.
    – Tetsujin
    Jun 15, 2018 at 6:46

2 Answers 2


To Get Firefox looking like Chrome and Safari

By default, Firefox only applies color correction to images that have embedded color profiles. You can enable full color management to apply color correction to everything, including colors defined in CSS. Then it should look more like Chrome and Safari.

In about:config (type that in to the address bar), set gfx.color_management.mode to 1.


Color Correction, Over Simplified

Monitors have different response curves. For example, the difference between #FF0000 and #FA0000 may be noticeable on some monitors, and not on others.

Color profiles contain the skews to compensate for this by altering the actual output, in an attempt to preserve contrast and overall accuracy of the intended appearance. They can be applied to monitors, printers, and other devices.

Many image formats support embedded color profiles; think of it boiling down to descriptors on how it’s supposed to look. If the system knows the inaccuracies of your monitor, it can combine that profile with the image’s profile to skew the output for the best possible reproduction.

When it comes to things without profiles, such as color values in CSS, some assumptions about intent must be made.

Let’s say your monitor does indeed produce a discernible difference between the two similar colors mentioned before. You use those colors in your CSS. The assumption is that your intent was to show the subtle difference. Some monitors out there may end up displaying the same color on the screen, despite the two colors being sent to them. Color correction alters the colors sent to the screen so a subtle difference actually is reproduced. If you wanted them to appear the same, you’d have just used #FF0000 and never bothered with #FA0000, right?

Digital Color Meter is aware of color profiles in use. This is why it gives different values over the same image across two different displays, and different values depending on what color space you’ve selected.

  • Not the best description of colour management, but the opening sentence nails it and answers the original question. Firefox appears not to apply the sRGB profile to untagged content (including CSS-defined colours), whereas the other browsers do. I noticed this when I had to match the colour in a tagged PNG graphic to the CSS-defined background colour—it was slightly out in Firefox. The solution was simply to remove the colour profile from the image. The colours still look more saturated in Firefox, but at least they're internally consistent.
    – Kal
    May 14, 2020 at 0:51

Funny to read the "experts'" replies. They simply need to run Firefox against their browser on their calibrated monitors to see the the very real difference. Whatever Firefox is doing (yes, Firefox, not a color profile, not a hardware device) it is enhancing vibrancy and providing a warmer color experience.

  • Sounds like a bad idea for anyone wanting reliable colour.
    – benwiggy
    Aug 12, 2021 at 13:12

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .