Contrast Finder

Contrast-Finder encuentra los contrastes adecuados de color para crear webs accesibles

Los criterios WCAG de éxito 1.4.3 requieren que el texto tenga un contraste mínimo de 4.5 (3 para textos largos).

Color en hexadecimal, RGB o palabras clave de color CSS.
Por ejemplo: #FFFFFF, rgb(255,255,255) o white
El contraste de tus colores no es suficiente.
Ratio actual: 1.85

Anterior contraste

Contraste inválido
Primer plano Fondo Ejemplo Ratio Distancia
  • hsl(0, 0%, 100%)
  • rgb(255, 255, 255)
  • #FFFFFF
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

1.84718

Nuevo contraste : 11 resultados (172 colores testados)

Contrastes válidos
Primer plano Fondo Ejemplo Ratio Distancia
  • hsl(0, 0%, 21%)
  • rgb(55, 55, 55)
  • #373737
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

6.44451 288.45
  • hsl(0, 6%, 29%)
  • rgb(80, 70, 70)
  • #504646
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

4.9309 262.18
  • hsl(0, 11%, 28%)
  • rgb(80, 64, 64)
  • #504040
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

5.29148 268.21
  • hsl(0, 18%, 26%)
  • rgb(80, 55, 55)
  • #503737
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

5.85188 277.46
  • hsl(0, 24%, 33%)
  • rgb(105, 64, 64)
  • #694040
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

4.72113 258.69
  • hsl(0, 33%, 30%)
  • rgb(105, 52, 52)
  • #693434
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

5.3089 271.92
  • hsl(0, 42%, 35%)
  • rgb(130, 53, 53)
  • #823535
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

4.52969 264.18
  • hsl(0, 53%, 33%)
  • rgb(130, 39, 39)
  • #822727
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

5.01116 280.66
  • hsl(0, 64%, 30%)
  • rgb(130, 28, 28)
  • #821C1C
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

5.33231 293.75
  • hsl(0, 82%, 33%)
  • rgb(155, 15, 15)
  • #9B0F0F
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

4.60468 305.98
  • hsl(0, 98%, 30%)
  • rgb(155, 1, 1)
  • #9B0101
  • hsl(68, 92%, 41%)
  • rgb(175, 203, 8)
  • #AFCB08

Título grande con palabras en negrita

Este es un texto de ejemplo con palabras en negrita para ilustrar el contraste.

4.73992 323.24
¿Insatisfecho?
Dame colores válidos y muy cercanos al color inicial