Požadavky AA a AAA
Běžný text potřebuje poměr 4,5 : 1 pro AA a 7 : 1 pro AAA. U velkého textu jsou hranice 3 : 1 a 4,5 : 1.
Kontrola kontrastu barev
Porovnejte barvu textu a pozadí s požadavky WCAG AA a AAA. Vyzkoušejte úpravu barvy nebo si dvojici uložte.
Vybrat režim
Text
Pozadí
Ukázkový nadpis
Na ukázce porovnejte vybranou barvu textu a pozadí. Požadovaný kontrast ověřte podle skutečné velikosti a tloušťky písma.
Malý text: Ověřte čitelnost zvolených barev při různých velikostech písma.
Další akce
Související nástroje
Vaše statistiky
0
Vybrané barvy
0
Exportované palety
0
Vytvořené přechody
0
Kontroly kontrastu
Výběr barvy
Nejpoužívanější režim
0%
Skóre aktivity
Jak zkontrolovat kontrast barev
Video se nepodařilo načíst. Můžete postupovat podle návodu níže.
Video ukazuje anglické rozhraní.
Zadejte HEX hodnoty včetně znaku # nebo použijte barevné vzorky. Ověřte platnost obou polí. Při změně barev se aktualizuje náhled i kontrastní poměr.
Ověřte barvu textu vůči pozadí
Průběžný výpočet a náhled
Změna kterékoli barvy aktualizuje poměr i ukázku textu. Nastavení velikosti mění náhled, všechny čtyři výsledky zůstávají viditelné.
Vyzkoušejte úpravu barvy
Volby Upravit na AA a Upravit na AAA se pokusí upravit barvu textu. S vybraným pozadím se to nemusí podařit, proto vždy zkontrolujte výsledný poměr.
Zobrazit další (3)Zobrazit méně
Orientační barevné filtry
Volby Protanopie, Deuteranopie a Tritanopie používají jednoduché obrazové filtry. Neprokazují čitelnost pro lidi s poruchou barvocitu.
Uložení dvojice barev
Pojmenujte předvolbu a uložte barvy textu a pozadí v tomto prohlížeči. Znovu je načtete přes Předvolby.
Další nástroje pro barvy
Odkazy na režimy otevřou samostatné stránky pro výběr barev, tvorbu palet, přechodů nebo získání barev z obrázku.
Časté otázky
Jak zkontroluji kontrast barev?
Vyberte barvu textu a pozadí nebo zadejte šestimístné HEX hodnoty. Zkontrolujte poměr a čtyři výsledky pro AA a AAA. Splnění požadavku platí pro danou dvojici barev a kategorii textu, nikoli pro celý web.
Jaký kontrast požaduje WCAG?
Pro běžný text vyžaduje úroveň AA alespoň 4,5 : 1 a AAA alespoň 7 : 1. U velkého textu stačí 3 : 1 pro AA a 4,5 : 1 pro AAA. Výjimky se vztahují například na loga a neaktivní ovládací prvky.
Lze kontrast upravit automaticky?
Volby Upravit na AA a Upravit na AAA zkoušejí zesvětlit nebo ztmavit text změnou kanálů RGB. Může se změnit i odstín a s některým pozadím se úprava nemusí podařit. Po každé úpravě zkontrolujte poměr.
Simulují filtry přesně poruchy barvocitu?
Používají jednoduché filtry sépie, sytosti a odstínu. Berte je jako orientační náhled. Nejde o ověřené modely barevného vidění a nepotvrzují přístupnost návrhu.
Zobrazit další (4)Zobrazit méně
Co se počítá jako velký text?
Podle WCAG jde o text o velikosti alespoň 18 pt v běžném řezu nebo 14 pt tučně. V CSS to odpovídá přibližně 24 px, respektive 18,67 px. Velikost ukázky v nástroji neurčuje, který požadavek platí pro váš skutečný návrh.
Je kontrola kontrastu zdarma?
Ano. MORELESS nabízí nástroj zdarma a bez účtu. Výpočty probíhají v tomto prohlížeči.
Mohu zkontrolovat firemní barvy?
Ano. Zadejte HEX hodnoty barvy textu a pozadí. Dvojici si můžete uložit jako pojmenovanou předvolbu v tomto prohlížeči. Každou skutečně používanou kombinaci textu a pozadí otestujte zvlášť.
Jak otevřu další nástroje pro barvy?
Použijte odkazy na režimy nad nástrojem. Otevřou samostatné stránky pro výběr barev, získání barev z obrázku, tvorbu palet a přechodů.
Technické podrobnosti
Relativní jas
Poměr se počítá z relativního jasu dvou barev sRGB. Pohybuje se od 1 : 1 pro stejné barvy po 21 : 1 pro černou a bílou. Nástroj porovnává dvě jednolité barvy, ne snímek stránky.
Požadavky na kontrast textu
Všechny čtyři výsledky vycházejí z nezaokrouhleného poměru. AA požaduje 4,5 : 1 pro běžný text a 3 : 1 pro velký. AAA požaduje 7 : 1 a 4,5 : 1. Samotné splnění těchto kontrol nedokládá celkový soulad s WCAG.
Zobrazit další (2)Zobrazit méně
Orientační filtry náhledu
Tři pojmenované náhledy barevného vidění používají na ukázku CSS filtry sépie, sytosti a posunu odstínu. Nemění vypočtený kontrastní poměr a nepředstavují ověřený model barevného vidění.
Úprava barev a ukládání
Úprava mění všechny tři RGB kanály textu po krocích, dokud nedosáhne cíle nebo pokus neskončí. Nezaručuje splnění požadavku ani zachování odstínu. Pojmenované dvojice barev se ukládají lokálně do IndexedDB.