Ellenőrizd két szín kontrasztarányát a WCAG AA és AAA akadálymentességi szintekkel szemben.
Így használd a következőt: Kontraszt ellenőrző
Válassz egy szövegszínt és egy háttérszínt.
Olvasd le a kontrasztarányt és a WCAG megfelelt vagy nem felelt meg jelvényeket.
Igazítsd a színeket, amíg megfelelnek a szükséges szintnek.
This is a WCAG color contrast checker that shows the exact contrast ratio between a text color and a background color, and whether it meets the AA and AAA accessibility levels. Pick colors with the swatch or by hex code and see a live preview.
Adjust the two colors until the badges pass the level you need, and the result updates instantly as you go.
Text that is too close in lightness to its background is hard or impossible to read, especially for people with low vision or color vision deficiencies, or for anyone on a phone in bright sunlight. Enough contrast keeps your content legible for everyone.
The Web Content Accessibility Guidelines (WCAG) set the standard. AA, the level most sites aim for and that many accessibility laws reference, requires a ratio of 4.5:1 for normal text and 3:1 for large text. AAA is stricter at 7:1 and 4.5:1.
Large text gets a lower threshold because bigger letters stay legible at less contrast. It counts as large at roughly 24px (18pt), or 18.66px (14pt) when bold.
The ratio comes from the relative luminance of the two colors using the official WCAG formula, producing a value from 1:1 (no contrast, identical colors) up to 21:1 (black on white).
Everything is calculated in your browser, so it is instant and private. Nothing you pick is uploaded anywhere.
Gyakran ismételt kérdések
A WCAG AA 4,5:1-et igényel normál szöveghez és 3:1-et nagy szöveghez (18pt vagy 14pt félkövér). Az AAA 7:1-et, illetve 4,5:1-et igényel.
A legalább 24px (18pt), vagy félkövér esetén 18,66px (14pt) méretű szöveg. A nagy szöveg alacsonyabb kontrasztarányt engedélyez.
Az egyes színek relatív világosságából a hivatalos WCAG képlettel, 1:1 (nincs kontraszt) és 21:1 (fekete fehéren) közötti értéket adva.
Eszköz beágyazása
Add hozzá ezt az eszközt a saját weboldaladhoz. Másold ki az alábbi kódrészletet, amely automatikusan naprakész marad.
<iframe src="https://monu.tools/embed/hu/color-contrast-checker" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>Kapcsolódó eszközök
Formázz és szépíts SQL lekérdezéseket záradék-sortörésekkel és egységes kulcsszó kisbetűsítéssel, vagy tömörítsd őket egyetlen sorba.
Szépíts XML-t megfelelő behúzással, vagy tömörítsd egyetlen sorba. A megjegyzések, CDATA és feldolgozási utasítások megmaradnak.
Szépíts CSS-t tiszta behúzással, vagy tömörítsd a fájlméret csökkentéséhez. Kezeli a médialekérdezéseket, a calc()-ot és a licencmegjegyzéseket.
Szépíts HTML-t blokktudatos behúzással, vagy tömörítsd. A pre, textarea, script és style tartalma megmarad.