Cómo usar esta herramienta para desarrolladores
- Pega o escribe los datos de entrada.
- Ajusta las opciones si están disponibles.
- Comprobar contraste.
- Revisa el resumen y copia o descarga el resultado.
Comprobador de contraste WCAG
Calcula la relación de contraste entre un color de texto y un color de fondo usando luminancia relativa sRGB. El resultado indica si la combinación supera los umbrales WCAG para texto normal y texto grande, y muestra la relación exacta para que puedas comparar variantes de diseño.
Datos de entrada
Colores: texto y fondoEspacio publicitario
Qué hace esta herramienta para desarrolladores
Compara dos colores mediante la fórmula de contraste basada en luminancia relativa de WCAG.
Convierte sRGB a luminancia lineal y aplica `(L1 + 0,05) / (L2 + 0,05)` con la luminancia más clara como L1.
El tamaño y peso tipográfico determinan si un texto cuenta como “grande” en WCAG.
Ejemplo
#111827
#ffffff
→ relación superior a 4.5:1 y cumplimiento AA para texto normal.
Casos de uso
- Depurar datos antes de integrarlos en una aplicación.
- Preparar valores listos para documentación o configuración.
- Comprobar rápidamente entradas durante desarrollo y pruebas.
Consejos para obtener resultados fiables
- Prueba primero con el ejemplo incluido para verificar el formato esperado.
- Revisa caracteres invisibles o espacios cuando una entrada falle.
- No compartas secretos, tokens ni credenciales en capturas o resultados.
- Valida la salida en el entorno final si depende de un estándar externo.
Detalles del procesamiento
Convierte sRGB a luminancia lineal y aplica `(L1 + 0,05) / (L2 + 0,05)` con la luminancia más clara como L1. Todo el procesamiento principal se ejecuta en el navegador y no requiere una API externa.
El tamaño y peso tipográfico determinan si un texto cuenta como “grande” en WCAG.
Preguntas frecuentes
¿Qué formato de entrada acepta comprobador de contraste wcag?
Acepta el formato indicado en el campo de entrada y valida los valores antes de generar el resultado.
¿Los datos de comprobador de contraste wcag se envían a un servidor?
No. El procesamiento principal se realiza localmente en el navegador mediante JavaScript.
¿Qué ocurre si la entrada de comprobador de contraste wcag no es válida?
La herramienta muestra un mensaje de error y no genera una salida hasta que corrijas la entrada.
¿Puedo copiar o descargar el resultado de comprobador de contraste wcag?
Sí. El resultado puede copiarse al portapapeles y descargarse en el formato indicado por la herramienta.
¿Debo revisar el resultado antes de usarlo en producción?
Sí. Conviene revisar la salida en el contexto real del proyecto, especialmente cuando intervienen compatibilidad, seguridad o estándares externos.
Herramientas relacionadas para desarrolladores
Resumen técnico
| Número | 063 |
|---|---|
| Categoría | Color y CSS |
| Procesamiento | Local en el navegador |
| Salida | TXT |
Explorar la categoría
Consulta más utilidades de color y css.
Abrir categoría