Modo oscuro
Resumen
El modo oscuro es un ajuste de visualización que cambia los colores de una aplicación o un sitio web a «texto claro sobre fondo oscuro». La combinación tradicional de «texto oscuro sobre fondo claro» se llama modo claro. iOS, Android, Windows y macOS admiten el modo oscuro a nivel de sistema.
Ventajas del modo oscuro
Entre las ventajas del modo oscuro está que reduce la carga para los ojos en entornos oscuros. Cuando usas el móvil de noche, el fondo blanco resulta deslumbrante. Si cambias al modo oscuro, baja el brillo de toda la pantalla y se suaviza el estímulo para los ojos.
En los dispositivos con pantalla OLED, también ayuda a reducir el consumo de batería. Como las pantallas OLED apagan por completo la emisión de luz de los píxeles negros, cuantas más zonas oscuras tiene la pantalla, menos energía consume. En las pantallas de cristal líquido (LCD) la retroiluminación está siempre encendida, así que no se obtiene este efecto.
Implementar el modo oscuro en un sitio web
Para implementar el modo oscuro en un sitio web se usa la media query de CSS «@media (prefers-color-scheme: dark)». Esta media query se aplica cuando el usuario ha elegido una combinación de colores oscura en la configuración del sistema operativo o del navegador. En Tailwind CSS, el prefijo «dark:» permite escribir de forma sencilla los estilos para el modo oscuro.
Como precaución al implementarlo, no basta con poner el fondo negro y el texto blanco. Una forma de hacerlo es usar para el fondo un gris oscuro (alrededor de #1a1a1a) en lugar de negro puro (#000), y para el texto un blanco roto (alrededor de #e5e5e5) en lugar de blanco puro (#fff). También hay que comprobar que las imágenes y los iconos no queden raros en el modo oscuro.
El modo oscuro y la accesibilidad
El modo oscuro también es importante desde el punto de vista de la accesibilidad. Para los usuarios con fotosensibilidad, una pantalla brillante puede provocar dolor de cabeza o de ojos. Ofrecer el modo oscuro es una atención para que estos usuarios puedan usar el servicio con comodidad.
Sin embargo, el modo oscuro no es adecuado para todo el mundo. Los usuarios con astigmatismo a veces encuentran difícil leer texto claro sobre fondo oscuro. Lo importante es que los usuarios puedan elegir el modo según sus preferencias y su situación, y no imponer ninguno de los dos.