What's the bottom line with the different browsers and working with color now?

Using Edge (or IE) my colors appear exactly as I thought I designed them.
Fairly recently, Chrome and Opera show the colors as really washed out.

Firefox is still showing the original like Edge does.
See the image blow (with a color picker).

What's the bottom line now? Will we have to redesign and color our icons and logos, or will there be a script which tells the browser to show the colors as we intended them?

Or will we just need to get a more modern monitor in the future, so that we can design images and colors more accurately to a standard?

Edited December 29, 20178 yr by Grant Barker

And then look at the site on a tablet or phone and they will look different again. And consider that people have different monitors and screens with a variety of brightness and contrast settings.

And everybody sees colour slightly different because of how their eyes work.

It's just one of those things and nobody really cares to much. As long as the content is good people will not worry about the subtleties of colour.

I understand where you're coming from but this issue has only been a recent change in Chrome and Opera. Before they all showed the colors to be the same hex. So how do we get the same hex in all browsers in the future? We could just a few months ago, and forever before that. 

The differences in the above example are not subtle. One logo looks clean and the other very dirty.

The YouTube logo is FF0000. In Chrome it's now DB3318.

So, I'm curious of when all the browsers will show the same standard or profile, or whatever the issue is, and what we have to do to get back to 3 or 4 months ago.

Edited December 29, 20178 yr by Grant Barker

There is no way to make sure all colors will look the same in different applications. It depends on the systems and graphic cards settings for color management. You might be able to configure the settings for different applications under your graphic card settings. Make sure all applications uses the same color profile. Most browsers should suppport sRGB.

Applications like PhotoShop uses advanced color management like AdobeRGB color profile which tend to render colors with more saturation than sRGB, color management in browsers are much more limited.

EDIT: for more consistent results make sure your icons are saved as sRGB: https://om4.com.au/client/preparing-images-color-profiles-srgb-adobe-rgb/

Edited December 29, 20178 yr by Nillervision

1 hour ago, Grant Barker said:

So how do we get the same hex in all browsers in the future?

You can't. You just have to live with it.

chrome latest stable shows youtube as #FF0000 (Version 63.0.3239.108 (Official Build) (64-bit)) for me on windows 10

It's a conspiracy I tell you!
I should check out my window..

(I'm using Snipaste as a colour picker.)
 

If you guys are seeing FF0000 when you check yourselves in Chrome with your own colour picker, then I'm really hoping it's a setting which has changed on my PC in relation to how Chrome and Opera show colours.

Different browsers, OS's, monitors and devices have always never displayed colours the same, it's been that way ever since colour monitors first appeared.

My advice, don't worry about it!

On 29/12/2017 at 10:13 AM, Grant Barker said:

I understand where you're coming from but this issue has only been a recent change in Chrome and Opera. Before they all showed the colors to be the same hex. So how do we get the same hex in all browsers in the future? We could just a few months ago, and forever before that. 

The differences in the above example are not subtle. One logo looks clean and the other very dirty.

The YouTube logo is FF0000. In Chrome it's now DB3318.

So, I'm curious of when all the browsers will show the same standard or profile, or whatever the issue is, and what we have to do to get back to 3 or 4 months ago.

This is one of the reasons I think colour theory like the colour wheel is so important especially for digital products, as although you could break the rules it is only advisable when you have enough experience to do so because it is not just the colour that needs to match, it's also the hue and tone that matters due to things like this, as even if the colour does not exactly match your intent, at least the tone and hue will look right and everything will still work together.

hmm installed snipaste and sampled youtube's logo in chrome and it was still #ff0000 - what colour management do you have for windows?? also what if you make a codepen with 'pure' css rgb or hex colours and then sample those? i.e. try adn take colour profiles or lack of attached to image out of the eqation? I  had a similar thing with a blue i was using for a site between browsers too....

Edited December 30, 20178 yr by davep
forgot something

4 hours ago, davep said:

hmm installed snipaste and sampled youtube's logo in chrome and it was still #ff0000 - what colour management do you have for windows?? also what if you make a codepen with 'pure' css rgb or hex colours and then sample those? i.e. try adn take colour profiles or lack of attached to image out of the eqation? I  had a similar thing with a blue i was using for a site between browsers too....

Thanks DaveP.

Actually, I'm learning about some of this stuff just the past couple of days really. It hasn't been an issue before. I asked at the Adobe forums, which has taught me about color management in general.

May I ask what color management ICC profile you have chosen? I'd like to go through my list of profiles and see if I can get FF3300 via Chrome as a basis for heading in the right direction for my monitor. Thanks.

Edited December 31, 20178 yr by Grant Barker

I'm using sRGB display profile with hardware configuration data derived from calibration

Thanks

There are many possible variables, from the calibration of the screen to the way each browser renders each colour number. I would suggest publishing the logo in svg format. I have had better consistency with that format.

Hope this helps.

Just a quick update. It turns out that turning Hardware Acceleration off in Chrome and Opera fixed the washed out colors. Now, all of the browsers show the same colors.

Not worth worrying about at all.  You have to accept that colours typography and so on will look slightly different given the array of environments the web operates in.  As web developers we have far bigger fish to fry, especially when there's nothing at all you can do about these differences.

8 hours ago, rbrtsmith said:

Not worth worrying about at all.  You have to accept that colours typography and so on will look slightly different given the array of environments the web operates in.  As web developers we have far bigger fish to fry, especially when there's nothing at all you can do about these differences.

I understand. As a content creator, I was concerned that the result I was getting, was a mistake I was making in the content creation process. I appreciate that once it's online - it's up to the recipient's hardware, specs, settings, eyesight, etc.