Cómo simular el daltonismo
- Pega tu paleta en la caja Palette colors, colores de marca, de gráficos o de estados de la interfaz, como códigos hex separados por comas, espacios o saltos de línea (el
#es opcional y valen abreviaturas de 3 dígitos comof0a). - Lee la tabla: cada fila es uno de tus colores y las columnas lo muestran bajo Original, Deuteranopia, Protanopia, Tritanopia y Achromatopsia. Fíjate en dos colores que se vuelvan idénticos.
- Opcionalmente sube una imagen (una captura, un gráfico, un mapa, una foto) y la herramienta muestra todo el diseño en paralelo bajo cada deficiencia.
- Todo se ejecuta localmente en tu navegador: sin subidas, sin cuenta, sin esperar a un servidor.
Por qué revisar tu diseño para el daltonismo
Alrededor de 1 de cada 12 hombres y 1 de cada 200 mujeres tienen alguna deficiencia de visión del color, unos 300 millones de personas en el mundo. La mayoría tiene un tipo rojo-verde, en el que rojos, verdes, naranjas y marrones se confunden entre sí. No son un público minoritario: compran en tu tienda, leen tu panel y rellenan tus formularios.
Los fallos que esto provoca suelen ser invisibles para quien creó el diseño, porque en su pantalla se ve perfectamente claro. Algunos clásicos:
- Una insignia roja de “agotado” / verde de “en stock” que se lee del mismo color.
- Un gráfico de líneas distinguido solo por líneas rojas y verdes.
- Un campo de formulario que se pone rojo al fallar sin icono ni mensaje.
- Un mapa electoral o de metro donde dos regiones contiguas se vuelven idénticas.
- Una instrucción de “pulsa el botón verde” donde el verde ya no se distingue de un rojo cercano.
Ver el diseño como lo ve una persona daltónica convierte esto de una guía abstracta en un evidente “vaya, esos dos son iguales”. La solución casi nunca es “usa colores distintos”, sino “no dependas solo del color”. Añade una etiqueta, un icono, un patrón o elige colores que también difieran en luminosidad para que sobrevivan al perder saturación.
Qué significan las simulaciones
Las tres vistas rojo-verde y azul-amarillo usan el modelo de Machado (2009), una simulación fisiológica construida a partir de cómo responden realmente los conos, aplicada en luz lineal para dar resultados correctos. Cada una representa la dicromacía, el caso completo, de severidad máxima, en el que falta todo un tipo de cono:
- Deuteranopía y protanopía, los dos tipos rojo-verde, con diferencia los más comunes.
- Tritanopía, un tipo azul-amarillo poco frecuente; azules y verdes convergen y los amarillos pueden desaparecer.
- Acromatopsia, daltonismo total. Solo queda el brillo, así que esta vista es una escala de grises real por luminancia. Es muy rara y sirve como prueba del peor caso: si tu diseño funciona aquí, funciona para todos, porque ya no depende del tono.
Las deficiencias “anómalas” más leves (donde un cono está desplazado en lugar de ausente) son más frecuentes que la dicromacía completa y verán algo intermedio entre estas vistas y la visión normal, así que trata estas simulaciones como el extremo más fuerte del rango, no como la única posibilidad.
Privacidad: tus maquetas no salen de tu dispositivo
Los diseños y capturas suelen ser confidenciales, un producto sin lanzar, la marca de un cliente, un panel interno. Esta herramienta nunca los sube. La imagen se decodifica y todas las simulaciones se calculan por completo en tu navegador con canvas y JavaScript, así que nada se envía a un servidor, se registra ni se almacena. Es seguro para trabajo bajo acuerdo de confidencialidad y funciona en un equipo aislado o sin conexión una vez cargada la página.
Usos habituales
- Revisar una paleta de marca o los colores de un sistema de diseño antes de publicar.
- Verificar que un gráfico o un mapa se lea sin color.
- Probar colores de correcto/error y de estado en una interfaz.
- Combinarlo con el Comprobador de Contraste para que tus colores sean a la vez distinguibles y legibles.
- Crear una paleta accesible en el Generador de Paletas de Colores y ponerla a prueba aquí.
