Detected: Dark mode Light mode
@media (prefers-color-scheme: dark) {
body {
background: black;
color: white;
}
}
@media (prefers-color-scheme: light) {
body {
background: white;
color: black;
}
}
Detected:
const isDarkMode = (window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)').matches : null);
const isLightMode = (window.matchMedia ? window.matchMedia('(prefers-color-scheme: light)').matches : null);
if(isDarkMode){
console.log("Dark mode");
}
else if(isLightMode){
console.log("Light mode");
}
else {
console.log("None (Can't detect / Not supported)");
}