ImageColorPicker.com

Verificador de contraste de color

Prueba la relación de contraste entre los colores de primer plano y de fondo para asegurar la accesibilidad.

Comprueba tus colores

Prueba combinaciones de colores para asegurarte de que cumplan con los estándares de accesibilidad WCAG para la legibilidad del texto.

20.26 à 1
Contraste
AAA
Risultatu di u testu
Súper

Paragunatu: #000000 nant'à #FBFBF9

Testu

16px, Normale (400)

Conta cum'è testu normale.

  • AA (WCAG 1.4.3): almenu 4.5:1

    Aprobado

  • AAA (WCAG 1.4.6): almenu 7:1

    Aprobado

Cumponenti di l'interfaccia è grafichi

Icone, bordi di input, indicatori di focus è altre parte chì hai bisognu di vede per aduprà l'interfaccia.

  • AA (WCAG 1.4.11): almenu 3:1

    Aprobado
20.26 à 1. Testu: passa AA, passa AAA. Cumponenti UI: passa.
Cume hè verificatu
Culori paragunati (dopu a mischiatura)
Testu #000000 nant'à u fondu #FBFBF9
Luminanza relativa
Testu 0.0000, fondu 0.9634
Formula
(L1 + 0.05) / (L2 + 0.05) induve L1 hè a luminanza di u culore più chjaru è L2 quellu di u culore più scuru.
Raportu esattu
20.2686 à 1, mustratu cum'è 20.26 à 1. U valore mustratu hè truncatu, micca arrutundatu, cusì ùn pare mai megliu ch'è hè. U valore esattu hè quellu chì si cumpara cù u requisitu.

Dimensione di testu: 16px, Normale (400)

Conta cum'è testu normale. U testu grande hè almenu 24px (18pt), o almenu 18.67px (14pt) quandu hè grassetto (pesu 700 o più). I dimensioni sò mostrati tagliati, micca arrotondati.

Conta cum'è testu normale. U testu grande hè almenu 24px (18pt), o almenu 18.67px (14pt) quandu hè grassetto (pesu 700 o più). I dimensioni sò mostrati tagliati, micca arrotondati.

Aa
Título de vista previa

El rápido zorro marrón salta sobre el perro perezoso

Ejemplo de texto pequeño (12px)

Texto
#000000
Fondo
#fbfbf9

Estándares WCAG

Nivel AA

Relación de contraste mínima de 4.5:1 para texto normal y 3:1 para texto grande. Requerido para la mayoría de los sitios web.

Nivel AAA

Relación de contraste mejorada de 7:1 para texto normal y 4.5:1 para texto grande. Recomendado para una accesibilidad óptima.

Verificador de contraste de color

Calcula la relación de contraste entre los colores del texto y el fondo.

Elige un color usando el Color Picker para el texto y el color de fondo o ingresa un color en formato hexadecimal RGB (por ejemplo, #259 o #2596BE). Puedes ajustar el deslizador para seleccionar el color. Las Pautas de Accesibilidad al Contenido Web (WCAG) tienen una guía específica para ayudar a determinar si el texto es legible para los usuarios con visión. Este criterio utiliza un algoritmo particular para mapear combinaciones de colores en proporciones comparables. Usando esta fórmula, WCAG establece que una relación de contraste de color de 4.5:1 entre el texto y su fondo es adecuada para texto normal (cuerpo), y el texto grande (18+ pt regular, o 14+ pt en negrita) debe tener al menos una relación de contraste de color de 3:1.

Características clave

  • Cálculo de relación de contraste en tiempo real
  • Verificación de cumplimiento WCAG AA & AAA
  • Deslizadores HSL para ajuste fino
  • Múltiples formatos de vista previa

Herramientas avanzadas

  • Corrección automática de color
  • Muestras de texto y fondo
  • Detección de nombre de color
  • Exportar resultados

Dumande frequenti

Per a cunfurmità WCAG AA, u testu nurmale richiede un rapportu di cuntrastu minimu di 4,5:1, mentre u testu grande (18pt o 14pt in grassu) richiede 3:1.

WCAG AAA richiede rapporti di cuntrastu più elevati: 7:1 per u testu nurmale è 4,5:1 per u testu grande, paragunatu à 4,5:1 è 3:1 di AA rispettivamente.

Usate a nostra funzione di currezzione automatica per regulà i culori di u testu o di u fondu mantenendu l'intenzione di u vostru design, o regulate manualmente i culori cù i cursori HSL, chì anu indicatori visivi chì mostranu e zone ottimali per a cunfurmità AA/AAA.

E zone verdi è i marcatori AA/AAA mostranu e gamme ottimali per righjunghje a cunfurmità WCAG. I suggerimenti di direzzione (Più chjaru/Più scuru) vi guidanu versu un megliu cuntrastu secondu a vostra cumbinazione di culori attuale.

Iè, pudete inserisce qualsiasi codice hex di culore o aduprà u selettore di culore per sceglie culori persunalizati. L'URL s'aghjorna automaticamente cusì pudete sparte cumbinazioni di culori specifiche.