Comprobador de Contraste de Color

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

    1.00:1
    Contraste
    Fail
    Muy deficiente

    Texto normal

    AA (4.5:1)
    AAA (7:1)

    Texto grande

    AA (3:1)
    AAA (4.5:1)
    Black
    #000000
    Eastern Blue
    #2596be

    Soluciones rápidas

    Aa

    Vista previa del título

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

    Ejemplo de texto pequeño (12px)

    Texto
    #000000
    Antecedentes
    #2596be

    Normas WCAG

    Level AA

    Relación de contraste mínima de 4,5:1 para texto normal y de 3:1 para texto grande. Obligatorio para la mayoría de los sitios web.

    Level AAA

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

    Contraste insuficiente para todos los tamaños de texto: incumple las normas WCAG.

    Comprobador de Contraste de Color

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

    Elige un color utilizando el selector de color para el texto y el color de fondo o introduce 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 en la Web (WCAG) tienen una pauta específica para ayudar a determinar si el texto es legible para los usuarios videntes. Este criterio utiliza un algoritmo concreto para asignar combinaciones de colores a proporciones comparables. Utilizando esta fórmula, las WCAG establecen que una relación de contraste de color de 4,5:1 con el texto y su fondo es adecuada para el texto normal (cuerpo), y que el texto grande (normal de más de 18 pt, o negrita de más de 14 pt) debe tener al menos una relación de contraste de color de 3:1.

    Características principales

    • Cálculo de la relación de contraste en tiempo real
    • Comprobación del cumplimiento de las WCAG AA y AAA
    • Deslizadores HSL para el ajuste fino
    • Múltiples formatos de previsualización

    Herramientas avanzadas

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