New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 771607 link

Starred by 4 users

Issue metadata

Status: Archived
Owner:
Closed: Jun 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Mac
Pri: 2
Type: Bug



Sign in to add a comment

Colours appear oversaturated compared to Firefox & Safari

Reported by yanwh...@gmail.com, Oct 4 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36

Steps to reproduce the problem:
1. Set #88b04b as CSS background color
2. Open in Chrome, Safari, Firefox Developer Edition
3. Notice the difference in colors!

What is the expected behavior?
CSS colors should render the same on all browsers.

What went wrong?
CSS Colors are not rendering correctly in Chrome.
FF and Safari also show a minor difference.

According to Photoshop color picker:
Chrome displays #51c04a
Safari displays #75b749
Firefox displays #88b04b (the correct color specified in CSS)

Did this work before? Yes Not sure but as far as I am aware my colors in Chrome appeared off (overly bright) in the last couple of weeks

Chrome version: 61.0.3163.100  Channel: stable
OS Version: OS X 10.11.6
Flash Version: 

I would expect that in 2017 CSS color rendering should be standard.
sRGB color space issues are bad enough, but why is this happening with CSS colors?
I am a web designer/developer and this kind of stuff causes nightmares with clients
 
Screen Shot 2017-10-04 at 14.51.57.png
203 KB View Download
Labels: Needs-Bisect Needs-Triage-M61
Cc: sc00335...@techmahindra.com
Components: Blink>Forms>Color
Labels: -Needs-Bisect -Type-Bug-Regression M-63 Triaged-ET OS-Linux OS-Windows Type-Bug
Status: Untriaged (was: Unconfirmed)
Able to reproduce this issue on reported version 61.0.3163.100 and on latest canary 63.0.3233.0 using Mac 10.12.6,Ubuntu 14.04 and Windows 10 with steps mentioned in comment#0. Attaching screenshot for reference.

Same behaviour is seen from M50[50.0.2661.54]. Hence considering this as Non-regression and marking as Untriaged.
Issue 771607.jpg
4.9 KB View Download

Comment 3 by tkent@chromium.org, Oct 5 2017

Components: -Blink>Forms>Color

Comment 4 Deleted

This bug has been around for a while... More info here:
https://stackoverflow.com/questions/39268675/css-div-background-color-bug-on-chrome
The -webkit:transform3D(0,0,0) "fixes" the colors.

A very simple html file shows the error too... view attached in another program, not Chrome as it renders it incorrectly!
bad chrom render.png
9.2 KB View Download

Comment 6 by yanwh...@gmail.com, Oct 13 2017

Is there any progress on this?
It seems strange that one of the biggest corporations in the world allows a bug this to go unfixed. The colours I am seeing on my client's websites look really garish.. :(


Components: Blink>Paint
Owner: ccameron@chromium.org
Status: Assigned (was: Untriaged)
Over to ccameron@ for all things color. What does the CSS spec have to say about color values like this?

To me this looks more likely to be an issue with sRGB/RGB conversion happening differently on different layers. We should at least be consistent between composited and non-composited content, even if we are opinionated on how to display the color.
Labels: Needs-Feedback
> According to Photoshop color picker:
> Chrome displays #51c04a
> Safari displays #75b749
> Firefox displays #88b04b (the correct color specified in CSS)

It's concerning that Chrome and Safari are different here -- they should be the same.

There is some confusion here about what "the correct color specified in CSS" means here. CSS colors are sRGB colors, and your monitor appears not to be an sRGB monitor. As a consequence, the colors must be converted to your monitor color space before being displayed.

Please check out the post at the first comment here for more background
https://www.designernews.co/stories/86411-google-chrome-rendering-colors-inaccurately

Please attach your monitor's color profile so I can figure out why Chrome isn't matching Safari here.
"In chrome://flags, there is an option called "Color correct rendering." If enabled, the colors render inaccurately."

This fixed the issue for me.

Quite surprised this wasn't mentioned.
Re #10, that setting exists only in Chrome 61. See the following document for more background
https://docs.google.com/document/d/1jMokB_OBkZVELu22li8vnHxAUoL1eGnLedP-1Gttv40/edit

To reiterate #9, we cannot debug the one concerning issue (that Chrome and Safari don't match) unless you attach your color profile to the bug.
Status: Archived (was: Assigned)
No updated from #9 and #11 after >6 months. Archiving. Please refer to the document in #11 about expected color behavior.

Sign in to add a comment