Myzel394
Myzel394

Reputation: 1317

How to detect whether prefers-color-scheme is supported by the browser

Is there a way to detect if the user's browser supports inheriting themes from the OS, like dark mode, using the prefers-color-scheme property?

I want to add a JavaScript-based theme switcher. If the user has already the support build in, I want to add a special button called "Auto". This should follow the system then.

Upvotes: 0

Views: 341

Answers (1)

Ryuno-Ki
Ryuno-Ki

Reputation: 800

If you want to detect the support JavaScript wise, one idea would be to set a variable in CSS, update its value in the media query for prefers-color-scheme and read that CSS variable with JavaScript.

Upvotes: 2

Related Questions