javascript - Edit "prefers-color-scheme" value to force Dark Mode - Stack Overflow

admin管理员组

文章数量:1287555

I've been looking for hours for a solution (online and in the Chrome console) but without success.

The "right" way to implement dark mode is to use media queries with the "prefers-color-scheme" parameter:

body {
    color:#fff;
}

@media (prefers-color-scheme: dark) {
    body {
        color:#fff;
        background:#333333
    }
}

If you can read this text Dark Mode is Working

I've been looking for hours for a solution (online and in the Chrome console) but without success.

The "right" way to implement dark mode is to use media queries with the "prefers-color-scheme" parameter:

body {
    color:#fff;
}

@media (prefers-color-scheme: dark) {
    body {
        color:#fff;
        background:#333333
    }
}

If you can read this text Dark Mode is Working

Some browsers (IE, Firefox Mobile, etc) or an app made with Xamarin are not able to pass this parameter in the correct way, so I'm looking for a way to change it manually. Possibly something like this:

screen.prefers-color-scheme = "dark"; //or
window.prefers-color-scheme = "dark"; //or
navigator.prefers-color-scheme = "dark"; 

I hoped it was a variable readable from the console but I wasted a lot of time looking for it with no success, I also read many posts about a meta named "color-scheme" but there's nothing like that in my projects (and the dark mode is working correctly)

This parameter is read in realtime on Windows and Mac osx, if you switch theme with the browser opened the dark mode will toggle.

Could this be saved in the session maybe? I'm losing my mind

本文标签： javascriptEdit quotpreferscolorschemequot value to force Dark ModeStack Overflow