color tools

Verificador de Contraste

Verificar ratios de contraste de color para cumplimiento WCAG. Verificar estándares AA y AAA.

Muestra Heading

This is normal text (18px). The quick brown fox jumps over the lazy dog.

This is small text (14px). The quick brown fox jumps over the lazy dog.

Contraste Relación

21.00:1
WCAG AA - Normal Text
PASS (Minimum: 4.5:1)
WCAG AA - Large Text
PASS (Minimum: 3:1)
WCAG AAA - Normal Text
PASS (Minimum: 7:1)

WCAG Guidelines

AA Normal: 4.5:1 minimum for text smaller than 18pt (or 14pt bold).

AA Large: 3:1 minimum for text 18pt+ (or 14pt+ bold).

AAA: 7:1 minimum for enhanced accessibility.

Importance: Good contrast ensures readability for users with visual impairments.

How to Use Verificador de Contraste

  1. 1

    Elegir color texto.

  2. 2

    Elegir color fondo.

  3. 3

    Ver ratio.

  4. 4

    Verificar WCAG.

  5. 5

    Ver vista previa.

Frequently Asked Questions

¿Qué es el ratio de contraste WCAG?

WCAG (Pautas de Accesibilidad al Contenido Web) define ratios mínimos de contraste para texto legible. Texto normal necesita 4.5:1 (AA) o 7:1 (AAA). Texto grande necesita 3:1 (AA) o 4.5:1 (AAA).

¿Por qué es importante el contraste de color?

El buen contraste asegura que el texto sea legible para todos, incluyendo personas con baja visión o daltonismo. Es legalmente requerido para muchos sitios web y mejora la experiencia del usuario para todos.

¿Qué colores tienen buen contraste?

Negro sobre blanco (21:1) es el contraste máximo. Azul oscuro sobre blanco, blanco sobre gris oscuro y púrpura oscuro sobre amarillo claro funcionan bien. Evite gris claro sobre blanco o azul oscuro sobre negro.

¿Este verificador es gratuito?

Sí, este verificador de contraste WCAG es completamente gratuito y verifica contraste de color al instante para diseño accesible.

Compartir herramienta

Comparte esta herramienta con otros

Related Tools