Generador de paleta de colores accesible Generar paletas de colores que cumplen con los requisitos de contraste de WCAG.
Generador de paletas de colores accesibles
Generar paletas de colores que cumplen con los requisitos de contraste de WCAG.
Establecer fondo
Ingrese su color de fondo.
Elegir nivel WCAG
Seleccione el objetivo de cumplimiento AA (4.5:1) o AAA (7:1).
Explorar y copiar
Vea los colores accesibles con sus razones de contraste y cópielos.
What Is Generador de paletas de colores accesibles?
Un generador de paletas accesibles encuentra colores que cumplen con los requisitos de contraste de la WCAG frente a tu color de fondo elegido. En lugar de probar manualmente colores individuales, esta herramienta analiza el espectro de colores y solo presenta aquellos que alcanzan tu ratio de contraste objetivo (AA en 4.5:1 o AAA en 7:1). Cada color se muestra con una vista previa de texto en vivo frente a tu fondo y su ratio de contraste exacta, lo que facilita encontrar colores accesibles que también se adapten a tu estética de diseño. Esto resuelve uno de los desafíos más comunes en el diseño accesible: encontrar colores que sean visualmente atractivos y cumplan con los estándares de accesibilidad. El generador recorre los matices y niveles de claridad para proporcionar una amplia gama de opciones accesibles.
Why Use Generador de paletas de colores accesibles?
-
Encuentra automáticamente colores que cumplen con los requisitos de contraste WCAG
-
Elige entre los niveles de cumplimiento AA (4.5:1) y AAA (7:1)
-
Vista previa de texto en vivo sobre su color de fondo
-
Muestra la razón de contraste exacta para cada color sugerido
-
Ahorra horas de verificación manual de contraste
Common Use Cases
Diseño web accesible
Crea paletas de colores garantizadas para cumplir con los requisitos WCAG desde el principio.
Creación de sistema de diseño
Genera colores de texto accesibles para cada color de fondo en su sistema.
Proyectos de clientes
Presente a los clientes opciones de colores que estén preverificadas para la accesibilidad.
Remediación
Encuentre alternativas accesibles cuando los colores existentes no superan las pruebas de contraste.
Technical Guide
El generador itera a través de ángulos de matiz (0-360° en intervalos de 30°) y niveles de claridad (10-90% en intervalos del 10%) con una saturación fija del 70%. Para cada color generado, calcula la ratio de contraste de la WCAG frente al fondo especificado utilizando la fórmula de luminancia relativa. Los colores que cumplen con el umbral mínimo de ratio se recopilan, ordenan por ratio de contraste (el más alto primero) y se presentan al usuario. El algoritmo cubre todo el espectro de matices, asegurando opciones de color diversas. Las ratios de contraste más altas indican una mejor legibilidad. Los umbrales mínimos se basan en los Criterios de Éxito 1.4.3 (AA) y 1.4.6 (AAA) de la WCAG 2.1.
Tips & Best Practices
-
1Comience con su color de fondo y encuentre colores de texto accesibles, no al revés
-
2Para fondos oscuros, los colores accesibles tienden a ser más claros; para fondos claros, más oscuros
-
3Las razones de contraste más altas siempre son mejores, apunte a superar el mínimo cuando sea posible
-
4Recuerde probar colores accesibles con simulación de daltonismo también
-
5Mantenga su paleta accesible pequeña (4-6 colores) para mantener la coherencia
Related Tools
Selector de colores
Selector de colores interactivo con salidas HEX, RGB, HSL y CMYK.
🎨 Color Tools
Generador de Paleta Monocroma
Genera una paleta de colores monocroma a partir de cualquier color base.
🎨 Color Tools
Generador de tonos de color
Genera tonos más oscuros de cualquier color con un recuento de pasos ajustable.
🎨 Color Tools
Comprobador de Relación de Contraste
Verifica las relaciones de contraste WCAG entre colores de primer plano y fondo.
🎨 Color Tools
Simulador de Daltonismo
Simula cómo se ven los colores para personas con diferentes tipos de deficiencia de visión del color.
🎨 Color ToolsFrequently Asked Questions
Q ¿Qué hace que un color sea accesible?
Q ¿Por qué faltan algunos matices en los resultados?
Q ¿Debo apuntar siempre a la cumplimiento AAA?
About This Tool
Generador de paletas de colores accesibles is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.