Respuesta breve
Ni el modo oscuro ni el claro facilitan la lectura a todo el mundo. Importan contraste, tamaño del texto, brillo, reflejos y controles, además de las preferencias personales. Compara el mismo artículo en condiciones similares: el nombre del tema no garantiza accesibilidad ni salud ocular.
¿Qué ajustes facilitan leer el mismo artículo?
Ni el modo oscuro ni el claro facilitan la lectura a todo el mundo. Importan contraste, tamaño del texto, brillo, reflejos y controles, además de las preferencias personales. Compara el mismo artículo en condiciones similares: el nombre del tema no garantiza accesibilidad ni salud ocular. Un párrafo gris tenue puede resultar difícil de leer en cualquiera de los temas, aunque la página parezca agradable. Mantén el mismo artículo, tamaño de letra y distribución al comparar. Después comprueba los colores concretos, los reflejos de la pantalla y los controles disponibles. Una captura muestra el aspecto visual, pero no demuestra que todas las personas puedan leer cómodamente.
Para una comparación personal justa, abra el mismo artículo en el mismo dispositivo y mantenga constantes su tipografía y diseño. Luego cambia el tema. Si la versión oscura también usa texto más pequeño o líneas más estrechas, ha cambiado varias variables y no puede atribuir la experiencia únicamente al color de fondo. Aún puedes preferir esa versión, pero el motivo no está claro hasta que se comparen las otras configuraciones.
Esta guía utiliza explicaciones de accesibilidad del W3C y documentación de preferencias de temas de MDN verificadas antes del 8 de octubre de 2026. Ofrece una evaluación de lectura e interfaz, no un diagnóstico de salud ocular ni un experimento de velocidad medida. Ninguno de los temas es declarado ganador universal. Una interfaz útil permite a las personas elegir una presentación viable y cambiarla a medida que cambia su situación.
El contraste relaciona dos colores concretos
La explicación del W3C sobre el contraste mínimo de las WCAG especifica al menos 4,5:1 para texto normal y 3:1 para texto que cumple la definición de grande, sujeto a las excepciones establecidas en el criterio. Estas proporciones comparan la luminancia relativa del primer plano y del fondo. No miden la luminosidad de la habitación, la comodidad médica ni la cantidad de palabras que alguien lee por minuto. Pasar el criterio del color del texto es un componente de accesibilidad, no un certificado para toda la página.
La excepción para texto grande tiene una definición: normalmente, al menos 18 puntos con peso normal o 14 puntos en negrita, según explica el W3C. No supongas que un párrafo cumple solo porque parece grande en tu pantalla. Los trazos finos pueden verse débiles incluso si los colores cumplen el umbral calculado. Hay que observar el texto tal como se muestra, además de comprobar sus colores.
Comprueba párrafos, enlaces, pies de foto de color tenue y etiquetas secundarias, no solo el título. Un tema puede dar buen contraste al texto principal y dejar difícil de leer información complementaria importante. Si la persona elige otra presentación, ofrece una forma de volver a las condiciones de contraste requeridas. Las preferencias y la legibilidad mínima deben poder coexistir, sin limitar al lector a una sola elección estética.
Mantén iguales tamaño, espaciado y brillo
Una comprobación de lectura personal debe comenzar con una posición cómoda del dispositivo y un tamaño de texto utilizable. Lea el mismo pasaje en cada tema, luego revise el enlace, el título y el encabezado de la sección. Observe si pierde su lugar, si las letras parecen débiles y si necesita hacer zoom. Ésas son observaciones útiles de su experiencia; no son investigaciones de población controlada ni evidencia de que un tema trate una condición médica.
A continuación, cambie otro factor deliberadamente. Pruebe con un tamaño de texto más grande o con un brillo de pantalla diferente, luego regrese al pasaje. Esta secuencia le ayuda a identificar si el tema fue el obstáculo principal o si las letras pequeñas y el brillo contribuyeron. Evite cambiar el tema, el zoom y el brillo de la pantalla simultáneamente y luego asignar toda la diferencia al modo oscuro.
El entorno puede cambiar la configuración preferida. Los reflejos en una pantalla en una habitación luminosa y una pantalla brillante en una habitación oscura son situaciones diferentes. Ajuste lo que pueda y permita elegir, en lugar de adjuntar una regla universal de mañana o tarde a los nombres de los temas. Las molestias visuales persistentes merecen un asesoramiento individual adecuado; Esta comparación de interfaces no establece su causa.
Comprobaciones para el mismo artículo
Como ejemplo aritmético explícito, el color de texto #222222 en #FFFFFF tiene una relación de contraste calculada de aproximadamente 15,91:1; #EEEEEE en #171717 tiene aproximadamente 15,45:1. Ambos superan el umbral del texto ordinario. En comparación, #888888 en #FFFFFF tiene aproximadamente 3,54:1 y cae por debajo de 4,5:1 para texto normal. Estos números provienen del cálculo de luminancia relativa WCAG para los colores indicados, no de la portada generada o de una prueba de lector.
| Comprobación | Condición | Si falla |
|---|---|---|
| Texto y diseño | Mismo fragmento, tamaño y espaciado | Elimina diferencias ajenas al tema |
| Texto normal | Al menos 4,5:1 según el criterio | Cambia colores de texto y fondo |
| Texto grande | 3:1 solo si cumple tamaño y grosor | Verifica que la excepción corresponda |
| Enlaces y pies | Siguen siendo legibles | Comprueba esos colores |
| Ampliación | El texto no se corta | Corrige diseño y acceso a controles |
| Teclado | Selector accesible y foco visible | Corrige interacción e indicador de foco |
| Comodidad | Lectura en condiciones reales | Permite elegir sin promesas médicas |
La preferencia del sistema es un punto de partida
MDN documenta la característica CSS prefers-color-scheme para detectar si una persona ha solicitado un tema claro u oscuro mediante el sistema operativo o el navegador. Permite usar esa preferencia como punto de partida. No informa del motivo de la elección, de una condición visual ni de los colores que funcionarán en cualquier artículo. Conviene conservar el identificador técnico exacto: describe un mecanismo concreto, no una evaluación de necesidades médicas.
Un diseño pensado para la lectura ofrece un selector de tema claro y una opción para seguir el sistema. Indica qué está seleccionado y permite cambiar sin perder la posición de lectura. Si recuerda una elección manual, el comportamiento debe resultar comprensible. Son recomendaciones para facilitar la lectura de artículos largos; la característica CSS documentada no incorpora automáticamente todas esas funciones de interfaz.
Verifique también el contenido incrustado. Un artículo oscuro que contiene un gráfico brillante, un formulario claro o una imagen con texto importante puede crear una experiencia diferente a la de los párrafos que lo rodean. Preservar la información y verificar que los controles sigan siendo legibles. Una paleta de texto principal exitosa no excusa el contenido secundario ilegible o un cambio de tema que desaparece de la vista.
Comprueba también ampliación y teclado
Las comprobaciones preliminares de accesibilidad del W3C incluyen formas útiles de inspeccionar el tamaño del texto y la interacción del teclado. Para un artículo extenso, aumente el tamaño de visualización y confirme que el texto permanezca disponible sin ser recortado por contenedores fijos. Compruebe si todavía se puede acceder a los títulos, subtítulos y controles. Un tema que se ve excelente en el tamaño predeterminado puede exponer problemas de diseño cuando alguien necesita ampliación.
Utilice un teclado para acceder al control del tema y otros enlaces importantes. Busque un indicador de enfoque visible y confirme que el estado del control tenga sentido. Esto no constituye una auditoría de accesibilidad completa, pero puede revelar un obstáculo que una comparación sólo de color pasaría por alto. Los lectores que no puedan utilizar cómodamente un puntero aún deberán cambiar el tema y navegar por el artículo.
No confíe únicamente en el color para explicar qué opción está activa. Una etiqueta de estado seleccionado, un estado de control apropiado u otro indicador claro pueden ayudar. El mismo principio se aplica a los enlaces dentro del texto: asegúrese de que los lectores puedan reconocerlos sin requerir una distinción de tono exacta. La accesibilidad requiere varias decisiones coordinadas y la polaridad de fondo es sólo una de ellas.
Cómo mantener la lectura ajustable
Para los lectores, el resultado útil es un conjunto de configuraciones que les permiten continuar cómodamente con el artículo: tema, tamaño del texto, brillo del dispositivo y posición de lectura. Si cambiar el tema ayuda, mantenga esa preferencia. Si ampliar el texto ayuda más, úsalo. No es necesario convertir su experiencia en una afirmación universal sobre la vista de otra persona o en una prueba de que una combinación de colores es científicamente mejor.
Para los editores, pruebe ambos temas con el mismo contenido e incluya las piezas que fácilmente se pasan por alto: enlaces, leyendas, indicadores de enfoque, formularios y diseños ampliados. Registre los colores exactos para las comprobaciones de contraste calculadas y describa las observaciones del usuario por separado. No inventes una mejora porcentual en la velocidad de lectura, fatiga o fatiga visual a partir de una captura de pantalla del antes y el después. Tales resultados requieren evidencia más allá de esta evaluación de la interfaz.
Preguntas frecuentes
¿El modo oscuro siempre es mejor para la vista?
No se demuestra aquí un beneficio médico universal. Las personas y las condiciones de lectura varían; el nombre del tema no describe el contraste, el tamaño, el brillo ni los reflejos. Elige una configuración que te resulte cómoda y puedas ajustar. Una molestia persistente requiere orientación individual: una captura atractiva no permite diagnosticar su causa ni demostrar que el modo oscuro la resolverá.
¿Un tema oscuro puede incumplir el contraste mínimo del texto?
Sí. La relación depende de los colores concretos del texto y del fondo. Un gris tenue puede fallar tanto sobre fondo oscuro como sobre fondo claro. Comprueba los colores de párrafos, enlaces y pies de foto. El criterio citado exige al menos 4,5:1 para texto normal y 3:1 para texto grande que cumpla su definición, con las excepciones indicadas.
¿Los cálculos de contraste indican qué tema se lee mejor?
No. Muestran cómo se comparan unos colores especificados con un umbral de contraste. Tanto el ejemplo claro como el oscuro lo superan; la diferencia numérica no mide comodidad ni velocidad de lectura. Preferencias, tamaño y reflejos son factores distintos. La ilustración de portada no proporciona esos valores: se calcularon a partir de los colores expresamente indicados en el artículo.
¿La web debería seguir automáticamente el tema del sistema?
Respetar la preferencia del sistema puede dar un punto de partida útil. MDN explica cómo la detecta prefers-color-scheme, pero esa señal no determina todas las necesidades de accesibilidad. Ofrecer selección manual y una opción que siga el sistema facilita el ajuste. Comprueba que el selector funcione con teclado y ampliación, sin ocultar texto ni hacer perder la posición de lectura.