Comprobador de contraste de color

Cómo hacerlo

1. 1
   Rellena los campos

   Escribe tus números o elige las opciones que necesites.

2. 2
   Mira el resultado

   La respuesta se actualiza al instante cuando cambias un valor.

3. 3
   Úsalo

   Copia el resultado o anótalo. No se envía nada a ningún sitio.

Sobre esta herramienta

Enter a text colour and a background colour as hex codes. You see the contrast ratio and whether it passes the WCAG 2 levels: AA needs 4.5 to 1 for normal text and 3 to 1 for large text, AAA needs 7 to 1 and 4.5 to 1. Good contrast helps everyone, especially people with low vision.

When to use it

Check text and background colours against WCAG contrast rules.

Tips

Aim for 4.5:1 for normal text and 3:1 for large text.

Privacy

Everything runs in your browser, so your data is not uploaded or stored.

Ejemplo práctico

With the boxes at their starting values (Text colour (hex): #1f2937; Background colour (hex): #ffffff), the tool shows: AA, normal text (4.5 : 1): Pass; AA, large text (3 : 1): Pass; AAA, normal text (7 : 1): Pass; AAA, large text (4.5 : 1): Pass; Interface parts and icons (3 : 1): Pass; Contrast ratio: 14.68 : 1. Change any box to see your own numbers. The result updates as you type, and nothing leaves your browser.

Consejos para mejores resultados

Revisa cada campo antes de fiarte de un resultado, porque un dígito equivocado cambia toda la respuesta. Usa las cifras exactas de tu nómina, factura, certificado o contrato y anota la fecha en que calculaste. Las tarifas, umbrales y normas cambian de vez en cuando, así que en impuestos, tasas y asuntos legales trata el resultado como una estimación y confírmalo con la fuente oficial indicada en esta página. Puedes probar todos los escenarios que quieras; no se guarda ni se envía nada, y al recargar la página se vacían los campos.