Prevádzkové

Kontrola kontrastu farieb

Reklama

Preview

Normal Text (16px)

Large Text (24px)

Contrast Ratio

21.00:1

WCAG Compliance

Normal Text

AA Pass
AAA Pass

Large Text (18pt+ or 14pt+ bold)

AA Pass
AAA Pass

UI Components & Graphics

AA Pass

WCAG Standards

Normal Text

  • AA: 4.5:1 minimum
  • AAA: 7:1 minimum

Large Text

  • AA: 3:1 minimum
  • AAA: 4.5:1 minimum

UI Components

  • AA: 3:1 minimum

Common Combinations

Black on White
White on Blue
White on Dark Gray
Zadajte svoje farebné kombinácie nižšie a otestujte ich pomocou nášho nástroja na kontrolu kontrastu farieb a okamžite uvidíte, či spĺňajú štandardy prístupnosti.
Reklama

Ako funguje náš kontrolór farebného kontrastu

Zadajte farby popredia a pozadia pomocou RGB hexadecimálnych hodnôt, alebo ich vyberte priamo pomocou výberu farieb.

 Môžeš:

  • Upravte Alfu, aby ste zmenili, aká priehľadná je farba popredia.
  • Použite posuvník Svetlosť, aby farba vyzerala svetlejšie alebo tmavšie.

Náš nástroj potom vypočíta kontrastný pomer a skontroluje ho podľa smerníc WCAG:

  • WCAG 2.0 Úroveň AA
  • Aspoň 4,5:1 pre bežný text tela
  • Aspoň 3:1 pre veľký text
  • WCAG 2.1 (UI a grafika)
  • Aspoň 3:1 pre ikony, okraje a ďalšie komponenty rozhrania
  • WCAG úroveň AAA
  • Aspoň 7:1 pre bežný text
  • Aspoň pomer strán 4,5:1 pre veľký text

Veľký text znamená buď:

  • 14 pt (asi 18,66 px) a tučným písmom, alebo
  • 18 pt (približne px) alebo viac

Kvapkadlo v Color Pickeri môžete použiť na získanie presných farieb z čohokoľvek na obrazovke. Uľahčuje to testovanie skutočných dizajnov, tlačidiel alebo pozadí.

Ak chcete odkazy, ktoré vyniknú len farbou, použite náš kontrolór farebného kontrastu, aby ste sa uistili, že spĺňajú štandardy prístupnosti a zostanú ľahko čitateľné pre všetkých.

 
 

Dokumentácia API čoskoro k dispozícii

Documentation for this tool is being prepared. Please check back later or visit our full API documentation.