Open Bug 1626560 Opened 2 years ago Updated 16 days ago

Pages with `color-scheme: dark` have too low link color contrast (in browsers that implement `color-scheme`)

Categories

(Core :: CSS Parsing and Computation, enhancement)

76 Branch
enhancement
Not set
normal

Tracking

()

UNCONFIRMED

People

(Reporter: steiner.thomas, Unassigned)

References

(Depends on 1 open bug)

Details

Attachments

(1 file)

Attached image demo-dark.png

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:76.0) Gecko/20100101 Firefox/76.0

Steps to reproduce:

This is a potential blocker for https://bugzilla.mozilla.org/show_bug.cgi?id=1525107 and https://bugzilla.mozilla.org/show_bug.cgi?id=1576289

URLs (if applicable): https://color-scheme-demo.glitch.me/
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
Safari: Fail
Chrome: Fail
IE/Edge: Fail (for old IE and new Edge)

Actual results:

What steps will reproduce the problem?

  1. Go to https://color-scheme-demo.glitch.me/
  2. Note how when the page is toggled to color-scheme: dark all user agent stylesheet link colors (apart from :active) have too low contrast.

Link colors (except for :active) should have enough contrast.

Expected results:

Link colors (except for :active) don't have enough contrast.

Since this probably requires changes to the user agent stylesheets, it would be great to agree on a cross-browser set of dark scheme default link colors.

Chrome
WebKit
Firefox

I have opened https://github.com/whatwg/html/issues/5426 for cross-vendor awareness.

I don't think this bug is testable or reproducible in Firefox, since we don't support color-scheme, per bug 1525107 [edit: sorry, I meant bug 1576289] (and the compat chart at https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme )

Am I understanding that right, or am I missing something here?

Flags: needinfo?(steiner.thomas)

That's correct, it's currently not reproducible. It's meant as a "forward-looking" bug. If you implement color-scheme, which, I think, you really should, then be aware that default colors need adjusting. Sorry if this wasn't clear from the previous comment (I used a Safari screenshot on purpose).

Flags: needinfo?(steiner.thomas)
Depends on: 1576289
Summary: Pages with `color-scheme: dark` have too low link color contrast → Pages with `color-scheme: dark` have too low link color contrast (in browsers that implement `color-scheme`)
You need to log in before you can comment on or make changes to this bug.