prefers-color-scheme – CSS media queries
El prefers-color-scheme es una nueva característica de CSS (media query) utilizada para detectar si el usuario ha establecido en su sistema si desea utilizar el tema claro (light) u oscuro (dark).
Existe un borrador de CSS media queries nivel 5 donde se especifica el esquema de color preferido.
Compatibilidad de sistemas operativos
Un sistema operativo que actualmente reconoce esta característica es MacOS Mojave.
Compatibilidad de navegadores
| Dispositivo | Navegador |
|---|---|
| Escritorio | Chrome |
| Edge | No |
| Firefox | 67 |
| Internet Explorer | No |
| Opera | No |
| Safari | 12.1 |
| Móvil | Android webview |
| Chrome for Android | 76 |
| Firefox for Android | 67 |
| Opera for Android | No |
| Safari en iOS | 13 |
Cómo utilizar prefers-color-scheme
@media (prefers-color-scheme: light) {
body{
background-color: white;
}
}
@media (prefers-color-scheme: dark) {
body{
background-color: black;
}
}

