Comprova la ràtio de contrast entre dos colors respecte als nivells d'accessibilitat WCAG AA i AAA.
Com fer servir Contrast de color
Tria un color de text i un color de fons.
Llegeix la ràtio de contrast i les insígnies de compliment WCAG.
Ajusta els colors fins que superin el nivell que necessites.
Aquest és un verificador de contrast de color WCAG que mostra la relació de contrast exacta entre un color de text i un color de fons, i si compleix els nivells d'accessibilitat AA i AAA. Tria els colors amb la mostra o pel codi hexadecimal i veu una previsualització en directe.
Ajusta els dos colors fins que els distintius superin el nivell que necessites, i el resultat s'actualitza a l'instant a mesura que avances.
El text que és massa proper en lluminositat al seu fons és difícil o impossible de llegir, especialment per a persones amb baixa visió o deficiències de la visió del color, o per a qualsevol que estigui amb el telèfon sota la llum brillant del sol. Prou contrast manté el teu contingut llegible per a tothom.
Les Pautes d'Accessibilitat per al Contingut Web (WCAG) estableixen l'estàndard. AA, el nivell que la majoria de llocs volen assolir i que moltes lleis d'accessibilitat referencien, requereix una relació de 4,5:1 per al text normal i 3:1 per al text gran. AAA és més estricte, amb 7:1 i 4,5:1.
El text gran té un llindar més baix perquè les lletres més grans es mantenen llegibles amb menys contrast. Compta com a gran cap als 24px (18pt), o 18,66px (14pt) quan és en negreta.
La relació prové de la luminància relativa dels dos colors utilitzant la fórmula oficial de la WCAG, i produeix un valor des d'1:1 (sense contrast, colors idèntics) fins a 21:1 (negre sobre blanc).
Tot es calcula al teu navegador, així que és instantani i privat. Res del que tries no es puja enlloc.
Preguntes freqüents
WCAG AA requereix 4,5:1 per a text normal i 3:1 per a text gran (18pt o 14pt en negreta). AAA requereix 7:1 i 4,5:1 respectivament.
Text que té com a mínim 24px (18pt), o 18,66px (14pt) quan és en negreta. El text gran admet una ràtio de contrast més baixa.
A partir de la luminància relativa de cada color amb la fórmula oficial de WCAG, donant un valor d'1:1 (sense contrast) a 21:1 (negre sobre blanc).
Incrusta aquesta eina
Afegeix aquesta eina al teu propi lloc web. Copia el fragment de sota; es manté actualitzat automàticament.
<iframe src="https://monu.tools/embed/ca/color-contrast-checker" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>Eines relacionades
Formata i embelleix consultes SQL amb salts de línia per clàusula i majúscules coherents a les paraules clau, o minifica-les a una sola línia.
Embelleix XML amb el sagnat adequat o minifica-lo a una sola línia. Es conserven comentaris, CDATA i instruccions de processament.
Embelleix CSS amb un sagnat net o minifica-lo per reduir la mida. Gestiona media queries, calc() i comentaris de llicència.
Embelleix HTML amb sagnat conscient dels blocs o minifica-lo. Es conserva el contingut de pre, textarea, script i style.