Intent to implement and ship: CSS 'prefers-color-scheme' media feature

[Mats Palmgren]

Summary:
The 'prefers-color-scheme' media feature is way for pages to detect
if the user prefers a light or dark color theme. The values are
'light', 'dark', and 'no-preference'. If the "resist fingerprinting"
feature is active we always match 'light'. If the media type is
'print' we always match 'light'. Otherwise, we try to determine
a value from the user's current "desktop theme". This should work
well on recent versions of OSX and Windows. On Linux, we don't
know how to determine a value from the system so we match
'no-preference' there - help wanted:
https://bugzilla.mozilla.org/show_bug.cgi?id=1525775

Bug:
https://bugzilla.mozilla.org/show_bug.cgi?id=1494034

Link to standard:
https://drafts.csswg.org/mediaqueries-5/#prefers-color-scheme

Platform coverage: All platforms

Estimated or target release: Firefox 67

Preference behind which this will be implemented:
The feature is always enabled, but there is an existing hidden
preference to set a value (integer), ui.systemUsesDarkTheme:
0 = light
1 = dark
2 = no-preference

Is this feature enabled by default in sandboxed iframes?
Yes, but if widget look-and-feel features are disabled in
sandboxed iframes then we'll match 'no-preference'.

DevTools bug: none

Do other browser engines implement this?
Safari has implemented this feature and it's available in their
Nightly build, but it's not yet shipped AFAICT.
https://paulmillr.com/posts/using-dark-mode-in-css/ is a post about
implementation of this feature in Safari;
https://webkit.org/blog/8475/release-notes-for-safari-technology-preview-68/
documents its addition.

It appears Chrome is actively working on it:
https://bugs.chromium.org/p/chromium/issues/detail?id=889087

web-platform-tests:
https://w3c-test.org/css/mediaqueries/prefers-color-scheme.html

Is this feature restricted to secure contexts? No

Credit also goes to Jonathan Kingston who wrote the initial
implementation of this feature.


/Mats

[Mats Palmgren]

[Hiroyuki Ikezoe]

The Android backend for prefers-color-scheme didn't get on Firefox 67, it's
just landed on mozilla-central, will be shipped in Firefox 68.

Thanks,
hiro

> _______________________________________________
> dev-platform mailing list
> dev-pl...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-platform
>

[Eric Shepherd (Sheppy)]

Presumably that’s noted appropriately in some manner in Bugzilla?

On March 19, 2019 at 7:45:53 PM, Hiroyuki Ikezoe (hik...@mozilla.com)
wrote:

The Android backend for prefers-color-scheme didn't get on Firefox 67, it's
just landed on mozilla-central, will be shipped in Firefox 68.

Eric Shepherd
Senior Technical Writer
MDN Web Docs <https://developer.mozilla.org/>
Blog: https://www.bitstampede.com/

[Hiroyuki Ikezoe]

It's https://bugzilla.mozilla.org/show_bug.cgi?id=1532850, it was at a
deeper level of blockers of bug 1494034, now I added bug 1532850 in the
dependency list of bug 1494034.

Thanks,
hiro

[Hiroyuki Ikezoe]

On Wed, Mar 20, 2019 at 8:45 AM Hiroyuki Ikezoe <hik...@mozilla.com> wrote:

> The Android backend for prefers-color-scheme didn't get on Firefox 67,
> it's just landed on mozilla-central, will be shipped in Firefox 68.
>

The backend was uplifted into Firefox 67 beta yesterday. So
prefers-color-scheme will be available on all platforms in Firefox 67.

Thanks,
hiro

[Gijs Kruitbosch]

Are there also plans to revisit our longstanding
foreground/background/link/visited-link colouring prefs (as well as
their companion use_system_colors pref) in light of this set of changes?
They've never really worked very well, nobody has really taken on fixing
their UX, and it would be nice if we could switch to something that was
better supported.

~ Gijs