prefers-color-scheme – CSS media queries

CSS

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

DispositivoNavegador
EscritorioChrome
EdgeNo
Firefox67
Internet ExplorerNo
OperaNo
Safari12.1
MóvilAndroid webview
Chrome for Android76
Firefox for Android67
Opera for AndroidNo
Safari en iOS13

Cómo utilizar prefers-color-scheme

@media (prefers-color-scheme: light) {
	body{
		background-color: white;
	}
}
@media (prefers-color-scheme: dark) {
	body{
		background-color: black;
	}
}

Escribe una respuesta


47 − 38 =