Comprobador de contraste de cor

Comproba as túas cores

Proba combinacións de cores para asegurarte de que cumpren os estándares de accesibilidade WCAG para a lexibilidade do texto.

1.00:1

Contraste

Non superado

Moi pobre

Texto normal

AA (4.5:1)

AAA (7:1)

Texto grande

AA (3:1)

AAA (4.5:1)

Cor do texto

Cor de fondo

Solucións rápidas

Título de vista previa

O rápido raposo marrón salta sobre o can preguiceiro

Exemplo de texto pequeno (12px)

Texto

#2596be

Fondo

#ffffff

Estándares WCAG

Nivel AA

Relación de contraste mínima de 4.5:1 para texto normal e 3:1 para texto grande. Requirido para a maioría dos sitios web.

Nivel AAA

Relación de contraste mellorada de 7:1 para texto normal e 4.5:1 para texto grande. Recomendada para unha accesibilidade óptima.

Contraste insuficiente para todos os tamaños de texto - non cumpre os estándares WCAG.

Calcula a relación de contraste entre as cores do texto e do fondo.

Escolle unha cor usando o seleccionador de cores para texto e cor de fondo ou introduce unha cor en formato hexadecimal RGB (por exemplo, #259 ou #2596BE). Podes axustar o control deslizante para seleccionar a cor. As Directrices de Accesibilidade ao Contido Web (WCAG) teñen unha directriz específica para axudar a determinar se o texto é lexible para usuarios con visión. Este criterio usa un algoritmo particular para mapear combinacións de cores en relacións comparables. Usando esta fórmula, a WCAG establece que unha relación de contraste de 4.5:1 entre o texto e o fondo é axeitada para texto normal e o texto grande (18+ pt regular ou 14+ pt en grosa) debe ter polo menos unha relación de contraste de 3:1.

Funcionalidades clave

Cálculo de relación de contraste en tempo real
Verificación de conformidade WCAG AA & AAA
Controis deslizantes HSL para axuste fino
Múltiples formatos de vista previa

Ferramentas avanzadas

Corrección automática de cores
Mostras de texto e fondo
Detección de nome de cor
Exportar resultados

Preguntas frecuentes

Para cumprir WCAG AA, o texto normal necesita unha relación de contraste mínima de 4,5:1, mentres que o texto grande (18pt ou 14pt en negra) necesita 3:1.

WCAG AAA esixe relacións de contraste máis altas: 7:1 para o texto normal e 4,5:1 para o texto grande, fronte a 4,5:1 e 3:1 de AA respectivamente.

Usa a nosa función de corrección automática para axustar o texto ou o fondo sen perder a intención do deseño, ou axusta as cores a man cos controis deslizantes HSL, que mostran con indicadores visuais as zonas óptimas para cumprir AA/AAA.

As zonas verdes e os marcadores AA/AAA mostran os intervalos óptimos para cumprir WCAG. As pistas de dirección (Máis claro/Máis escuro) guíanche cara a un mellor contraste segundo a túa combinación actual de cores.

Si, podes introducir calquera código hex ou usar o selector de cor para escoller cores personalizadas. A URL actualízase automaticamente para que poidas compartir combinacións concretas.