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.

Ako funguje naša kontrola kontrastu farieb

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

 

  • Upravte Alfa, aby ste zmenili transparentnosť farby popredia.
  • Pomocou posúvača Svetlosť môžete farbu zosvetliť alebo stmaviť.

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

  • WCAG 2.0 úroveň AA
  • Minimálne 4,5:1 pre normálny hlavný text
  • Minimálne 3:1 pre veľký text
  • WCAG 2.1 (používateľské rozhranie a grafika)
  • Aspoň 3:1 pre ikony, okraje a ďalšie súčasti rozhrania
  • WCAG Úroveň AAA
  • Minimálne 7:1 pre normálny text
  • Minimálne 4,5:1 pre veľký text

Veľký text znamená buď:

  • 14 bodov (približne 18,66 px) a tučné, alebo
  • 18 bodov (približne px) alebo väčšie

Ak chcete získať presné farby z čohokoľvek na obrazovke, môžete použiť kvapkadlo vo výbere farieb.

Ak chcete, aby vynikli odkazy, ktoré sa spoliehajú len na farby, použite našu kontrolu kontrastu farieb, aby ste sa uistili, že spĺňajú štandardy dostupnosti a sú pre každého ľahko čitateľné.