# Comprobador de contraste de paleta accesible Audita combinaciones de color segun WCAG 2.1 AA y AAA y propone ajustes > Página canónica: https://elysiatools.com/es/tools/accessible-color-palette-contrast-checker - **Categoría:** Design - **Palabras clave:** wcag, contrast, accessibility, palette, color audit, design system ## Descripción general Util para sistemas de diseno, marcas y temas visuales con recomendaciones de ajuste minimo. ## Entradas - **Colores de la paleta** (textarea): brand-primary: #1D4ED8 brand-secondary: #F59E0B surface: #FFFFFF text: #111827 - **Objetivo WCAG** (select) - **Incluir pares del mismo color** (checkbox) ## Cuándo usarlo - Al crear o actualizar un sistema de diseño para asegurar que todos los colores base sean accesibles desde el inicio. - Durante auditorías de accesibilidad web para verificar si la paleta de colores actual de una marca cumple con las normativas WCAG. - Al definir temas visuales como modos claro y oscuro para garantizar un contraste adecuado entre el texto y los fondos. ## Cómo funciona - Introduce los colores de tu paleta en formato de texto, asignando un nombre y un código hexadecimal a cada uno (por ejemplo, 'superficie: #FFFFFF'). - Selecciona el objetivo de accesibilidad deseado, como WCAG AA para texto normal (ratio 4.5:1) o AAA para máxima legibilidad. - Opcionalmente, elige si deseas incluir la comparación de pares del mismo color en el análisis. - La herramienta procesa todas las combinaciones posibles y devuelve un informe detallado con los pares que fallan y sugerencias de ajuste. ## Casos de uso - Validación masiva de paletas de colores para nuevas identidades de marca antes de su lanzamiento. - Generación de informes de accesibilidad visual para clientes o equipos de desarrollo frontend. - Ajuste de variables de color en archivos CSS o Tailwind para cumplir con los requisitos legales de accesibilidad web. ## Preguntas frecuentes ### ¿Qué es el estándar WCAG AA y AAA? Son niveles de conformidad de las Pautas de Accesibilidad para el Contenido Web. AA requiere un contraste de 4.5:1 para texto normal, mientras que AAA exige 7:1. ### ¿Cómo debo formatear los colores de entrada? Debes ingresar un color por línea, usando el formato 'nombre: #hexadecimal', por ejemplo, 'texto: #111827'. ### ¿La herramienta sugiere nuevos colores? Sí, el informe identifica las combinaciones que no cumplen el estándar y proporciona recomendaciones de ajuste mínimo para alcanzar el contraste necesario. ### ¿Puedo probar colores para textos grandes? Sí, puedes seleccionar objetivos específicos como 'AA Large Text' (ratio 3:1) o 'AAA Large Text' (ratio 4.5:1) en la configuración. ### ¿Qué significa incluir pares del mismo color? Es una opción que evalúa el contraste de un color contra sí mismo, útil en casos muy específicos de pruebas de componentes superpuestos, aunque normalmente se mantiene desactivada. ## Herramientas relacionadas - [Verificador de Accesibilidad de Color](https://elysiatools.com/es/tools/color-accessibility-checker): Verifica los ratios de contraste de color para el cumplimiento de WCAG - [Verificador de Contraste de Color](https://elysiatools.com/es/tools/color-contrast-checker): Verificar la relación de contraste de color y el cumplimiento de WCAG para accesibilidad - [Convertidor de espacios de color](https://elysiatools.com/es/tools/color-space-converter): Convierte colores entre HEX, RGB, HSL, CIELAB y Display-P3 con salida CSS y control de gama. - [Comprobador de accesibilidad de vision del color](https://elysiatools.com/es/tools/color-vision-accessibility-checker): Mide contraste WCAG, simula deficiencias visuales y marca zonas de bajo contraste en capturas UI. - [Calculadora de Macronutrientes para NPT](https://elysiatools.com/es/tools/tpn-macronutrient-calculator): Calcula glucosa/aminoácidos/lípidos en gramos y kcal, calorías no proteicas, la relación kcal no proteicas:g de nitrógeno, la distribución calórica y los valores por kg, a partir de la prescripción de nutrición parenteral. Densidades: dextrosa 3.4 kcal/g, aminoácidos 4.0 kcal/g, lípidos 20% ≈ 2.0 kcal/mL (10% 1.1, 30% 3.0). Nitrógeno de AA ≈ 16% → N = AA × 0.16. Relación kcal no prot:g N óptima ~150:1 (ahorro proteico); <100:1 proteica (estrés); >200:1 energética (riesgo de sobrealimentación: más CO₂, esteatosis). Metas (ASPEN/ESPEN): energía 20–30 kcal/kg/día (estrés hasta 30–35); proteína 1.0–1.5 g/kg/día (crítico hasta 2.0); glucosa ≤ 4–5 mg/kg/min; lípidos ≤ 1.0–1.5 g/kg/día, ≤30–40% de kcal no proteicas. Precauciones: herramienta de análisis, no receta — la NPT se prepara en farmacia en condiciones asépticas; verifique la curva Ca-PO₄ para evitar precipitación; reinicie nutrición enteral cuanto antes (la NPT tiene mayor riesgo de CLABSI y metabólico); monitorice glucosa, triglicéridos, perfil hepático, electrolitos y balance diario. Fuentes: ASPEN 2016, ESPEN 2019, McClave 2016, Mirtallo 2004. No es consejo médico. - [Generador de informes de auditoria de accesibilidad](https://elysiatools.com/es/tools/accessibility-audit-report-generator): Audita HTML o una URL para detectar problemas comunes de WCAG y exporta un PDF estructurado - [Verificador de accesibilidad](https://elysiatools.com/es/tools/accessibility-checker): Detecta problemas comunes de WCAG 2.1 en HTML, paginas o imagenes de diseno y devuelve sugerencias accionables - [Generador de Esquemas de Color](https://elysiatools.com/es/tools/color-scheme-generator): Genera esquemas de color y paletas profesionales para proyectos de diseño ## Ejemplos - [Ejemplos de Códigos de Color](https://elysiatools.com/es/samples/color-code): Colección de códigos de color en varios formatos (Hex, RGB, HSL, colores con nombre) para pruebas de validación - [Ejemplos de Procesamiento de Imágenes Android Java](https://elysiatools.com/es/samples/android-image-processing-java): Ejemplos de procesamiento de imágenes Android Java incluyendo lectura/escritura, escalado y conversión de formato - [Ejemplos de Procesamiento de Imágenes Android Kotlin](https://elysiatools.com/es/samples/android-image-processing-kotlin): Ejemplos de procesamiento de imágenes Android Kotlin incluyendo lectura/escritura, escalado y conversión de formato - [Ejemplos de Procesamiento de Imágenes Web Python](https://elysiatools.com/es/samples/web-image-processing-python): Ejemplos de procesamiento de imágenes Web Python usando PIL/Pillow incluyendo lectura, guardado, redimensionamiento y conversión de formato ## Contenido relacionado - [Generadores de efectos CSS, paletas y tokens de diseno](https://elysiatools.com/es/hubs/design-generate): Herramientas reunidas para efectos visuales CSS, construccion de paletas y generacion de tokens de diseno en un solo hub. - [Herramientas de auditoria de accesibilidad web y color accesible](https://elysiatools.com/es/hubs/web-accessibility-audits): Revisa problemas WCAG, orden de lector de pantalla, fallos de contraste, riesgo de vision cromatica y elecciones de color accesible en un solo hub para flujos de accesibilidad web. - [Herramientas de Diseño de Color y Conversión de Espacios de Color](https://elysiatools.com/es/hubs/color-design-tools): Comparar convertidores de color, generadores de paletas, herramientas de armonía, verificadores de accesibilidad y utilidades de ajuste de color en un solo lugar para diseñadores y desarrolladores. - [Herramientas de conversion de espacios de color para web e impresion](https://elysiatools.com/es/hubs/design-convert): Herramientas reunidas para conversion de espacios de color entre web e impresion en un solo hub.