Simulador de Daltonismo
Alrededor del 8% de los hombres y el 0.5% de las mujeres tienen alguna forma de deficiencia de visión del color, sobre todo rojo-verde. Sube un diseño, captura de pantalla o ilustración, elige un modo de simulación y compara el original con el resultado simulado lado a lado. Útil para verificar si un gráfico, mapa o interfaz sigue siendo legible cuando no se depende solo del color.
Cómo funciona el simulador
-
1
Sube una imagen
PNG, JPG, WebP o SVG. Procesado en el navegador, nada subido.
-
2
Elige un modo de simulación
Selecciona protanopía, protanomalía, deuteranopía, deuteranomalía, tritanopía, tritanomalía, acromatopsia o acromatomalía.
-
3
Compara lado a lado
El navegador aplica una transformación de matriz y muestra el original junto a la simulación seleccionada.
-
4
Exporta la imagen simulada
Descarga la simulación seleccionada como PNG o toma capturas de pantalla de la comparación para revisiones de diseño.
Formas de deficiencia de visión del color
| Condición | Prevalencia | Característica |
|---|---|---|
| Deuteranomalía | ~5% de hombres | Anomalía rojo-verde, M-cono desplazado |
| Protanomalía | ~1% de hombres | Anomalía rojo-verde, L-cono desplazado |
| Deuteranopía | ~1% de hombres | M-cono ausente, rojo-verde apenas distinguible |
| Protanopía | ~1% de hombres | L-cono ausente, percepción del rojo desplazada |
| Tritanopía | muy rara | S-cono ausente, eje azul-amarillo colapsado |
| Tritanomalía | muy rara | S-cono desplazado, leve pérdida azul-amarillo |
| Acromatopsia | extremadamente rara | Ceguera total al color, solo escala de grises |
La mayoría de los diseñadores empieza con deuteranopía y protanopía porque las deficiencias rojo-verde son las más comunes, y añade los modos anómalos y azul-amarillo para una revisión más amplia.
Implicaciones de diseño
- No confíes solo en rojo/verde para distinguir estados. Los indicadores de error/éxito necesitan una forma, ícono o etiqueta de texto además del color. Una X roja y un check verde son perceptiblemente diferentes; círculos rojos y verdes no lo son.
- Gráficos: usa rellenos de patrones, etiquetas directas o paletas perceptivamente distintas (ColorBrewer, Viridis). Evita la paleta de semáforo para visualización de datos.
- Mapas: bordes y tramas para distinguir regiones; el color solo falla.
- Hipervínculos: nunca estilizados solo por color. Subrayados o peso ayudan a todos, incluyendo personas con visión normal del color.
- Campos de formulario requeridos: un asterisco rojo más etiqueta “Requerido” o borde rojo más texto de ayuda “Requerido”.
- Indicadores de estado: el semáforo rojo/ámbar/verde funciona como refuerzo, nunca como la única señal.
Buenas elecciones de paleta para diseño a prueba de color
- Viridis (usado por defecto en matplotlib, D3): de púrpura a amarillo, perceptivamente uniforme.
- ColorBrewer cualitativo: 8 tonos distintos diseñados para seguir siendo distinguibles en formas comunes de CVD.
- Okabe-Ito: paleta de 8 colores específicamente diseñada para accesibilidad daltónica.
Herramientas y pruebas
- Vistas previas del simulador (esta herramienta), verificación visual rápida.
- Verificador de contraste WCAG, asegura que el texto siga siendo legible independientemente de la percepción del color.
- Pruebas con usuarios reales, nada reemplaza mostrar tu diseño a usuarios daltónicos reales.
Dato curioso
Los simuladores modernos de visión del color usan aproximaciones matriciales de cómo las respuestas de los conos se traducen a RGB. Trata la vista previa como una ayuda práctica de diseño, no como un diagnóstico médico ni como una copia exacta de la percepción de una persona concreta.
Preguntas frecuentes
Es una aproximación útil, pero la percepción real del color varía entre personas. La mayoría de quienes tienen una deficiencia rojo-verde se sitúan en un espectro de leve a severo, así que usa la vista previa como señal de diseño, no como diagnóstico.
La deuteranomalía cubre la mayor parte de los usuarios daltónicos (~5% de hombres). Probar contra deuteranopía (la forma severa) es una verificación conservadora, si un diseño funciona allí, también funciona para la anomalía más leve.
Sí, aunque con mucha menos frecuencia (~0.5%). La deficiencia rojo-verde es recesiva ligada al X, por lo que los hombres (XY) solo necesitan un X afectado; las mujeres (XX) necesitan ambos. La tritanopía es autosómica y afecta a ambos sexos por igual.
No directamente en esta herramienta, eso es simulación general de baja visión, que también implica desenfoque y reducción de contraste. Para simulación de accesibilidad completa, herramientas dedicadas como Lighthouse de Chrome o NoCoffee cubren eso.
Herramientas relacionadas
Creador de listas por niveles
Crea una lista privada con texto e imágenes locales, personaliza niveles, clasifica con arrastre o teclado y exporta JSON, PNG o SVG.
Comprimir GIF
Reduce el tamaño de un GIF animado en el navegador: baja dimensiones, conserva menos fotogramas y ajusta la calidad de codificación. Previsualiza el bucle antes de descargar.
Creador de GIF
Convierte una secuencia de imágenes en un GIF animado. Ajusta fotogramas por segundo, calidad y tamaño antes de exportar.
WebP a JPG
Convierte imágenes WebP a JPG/JPEG directamente en el navegador. Elige la calidad, aplana la transparencia sobre un color de fondo y descarga sin subir archivos.
Generador de códigos de barras
Crea en el navegador códigos de barras 1D en Code 128, EAN, UPC, ITF-14 y otros formatos compatibles. Descarga el resultado como SVG o PNG.
Generador de códigos QR
Genera un código QR localmente en el navegador a partir de una URL, texto plano o una carga QR correctamente formateada, y descárgalo como PNG.