Գործառնական

Գույնի հակադրության ստուգիչ

Գովազդ

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
Մուտքագրեք ձեր գունային համակցությունները ստորև՝ դրանք ստուգելու մեր գունային հակադրության ստուգիչով և անմիջապես տեսնելու, թե արդյոք դրանք համապատասխանում են մատչելիության չափանիշներին:

Ինչպես է աշխատում մեր գունային հակադրության ստուգիչը

Մուտքագրեք ձեր առաջին պլանի և ֆոնի գույները՝ օգտագործելով RGB վեցանկյուն արժեքները, կամ ընտրեք դրանք անմիջապես Գույնի ընտրիչով:

 

  • Կարգավորեք Alpha՝ փոխելու համար, թե որքան թափանցիկ է առաջին պլանի գույնը:
  • Օգտագործեք Lightness սահիչը՝ գույնն ավելի բաց կամ մուգ տեսք հաղորդելու համար:

Այնուհետև մեր գործիքը հաշվարկում է հակադրության հարաբերակցությունը և ստուգում այն ​​WCAG ուղեցույցների համաձայն.

  • WCAG 2.0 մակարդակի AA
  • Առնվազն 4.5:1 սովորական հիմնական տեքստի համար
  • Առնվազն 3:1 մեծ տեքստի համար
  • WCAG 2.1 (UI և գրաֆիկա)
  • Առնվազն 3:1 պատկերակների, եզրագծերի և միջերեսի այլ բաղադրիչների համար
  • WCAG մակարդակ AAA
  • Առնվազն 7:1 նորմալ տեքստի համար
  • Առնվազն 4.5:1 մեծ տեքստի համար

Մեծ տեքստ նշանակում է կամ.

  • 14 pt (մոտ 18,66 px) և թավ, կամ
  • 18 pt (մոտ px) կամ ավելի մեծ

Դուք կարող եք օգտագործել աչքի կաթիլիչը Գույնի ընտրիչում՝ ձեր էկրանի ցանկացած բանից ճշգրիտ գույներ վերցնելու համար:

Որպեսզի միայն գույնի վրա հիմնված հղումներն աչքի ընկնեն, օգտագործեք մեր գունային հակադրության ստուգիչը՝ համոզվելու համար, որ դրանք համապատասխանում են մատչելիության չափանիշներին և հեշտ ընթեռնելի են բոլորի համար: