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

Ստուգիր ֆոնի և տեքստի գույների հակադրության հարաբերակցությունը՝ ապահովելու համար հասանելիությունը։

Ստուգեք ձեր գույները

Ստուգիր գույների համադրությունները՝ համոզվելու համար, որ դրանք համապատասխանում են WCAG հասանելիության չափանիշներին տեքստի ընթեռնելիության համար։

1.00:1
Հակադրություն
Չանցավ
Շատ վատ

Սովորական տեքստ

AA (4.5:1)
Չանցավ
AAA (7:1)
Չանցավ

Մեծ տեքստ

AA (3:1)
Չանցավ
AAA (4.5:1)
Չանցավ

Արագ ուղղումներ

Aa
Նախադիտման վերնագիր

Արագ շագանակագույն աղվեսը ցատկում է ծույլ շան վրայով

Փոքր տեքստի օրինակ (12px)

Տեքստ
#ffffff
Ֆոն
#018786

WCAG չափանիշներ

Մակարդակ AA

Նվազագույն հակադրության հարաբերակցություն 4.5:1 սովորական տեքստի և 3:1 մեծ տեքստի համար։ Պահանջվում է մեծամասնության կայքերի համար։

Մակարդակ AAA

Բարձրացված հակադրության հարաբերակցություն 7:1 սովորական տեքստի և 4.5:1 մեծ տեքստի համար։ Առաջարկվում է օպտիմալ հասանելիության համար։

Անբավարար կոնտրաստ բոլոր տեքստի չափերի համար - չի համապատասխանում WCAG ստանդարտներին։

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

Հաշվիր տեքստի և ֆոնի գույների հակադրության հարաբերակցությունը։

Ընտրիր գույնը գույնի selector-ի միջոցով տեքստի և ֆոնի գույնի համար կամ մուտքագրիր գույնը RGB հեքսադեցիմալ ձևաչափով (օրինակ՝ #259 կամ #2596BE): Կարող ես կարգավորել սլայդերը գույն ընտրելու համար։ Վեբ բովանդակության հասանելիության ուղեցույցները (WCAG) ունեն հատուկ ուղեցույց, որը կօգնի պարզել, արդյոք տեքստը ընթեռնելի է տեսողություն ունեցող օգտատերերի համար։ Այս չափանիշը օգտագործում է հատուկ ալգորիթմ՝ գույնի համադրությունները համեմատելի հարաբերակցությունների վերածելու համար։ Օգտագործելով այս բանաձևը, WCAG-ը նշում է, որ 4.5:1 գույնի հակադրության հարաբերակցությունը տեքստի և դրա ֆոնի հետ բավարար է սովորական (մարմնի) տեքստի համար, իսկ մեծ տեքստը (18+ pt սովորական, կամ 14+ pt հաստ) պետք է ունենա առնվազն 3:1 գույնի հակադրության հարաբերակցություն։

Հիմնական հնարավորություններ

  • Կոնտրաստի հարաբերակցության իրական ժամանակի հաշվարկ
  • WCAG AA & AAA համապատասխանության ստուգում
  • HSL սլայդերներ նուրբ կարգավորման համար
  • Բազմաթիվ նախադիտման ձևաչափեր

Ընդլայնված գործիքներ

  • Գույների ավտոմատ ուղղում
  • Տեքստի և ֆոնի նմուշներ
  • Գույնի անվան ճանաչում
  • Արդյունքների արտահանում

Հաճախ տրվող հարցեր

WCAG AA համապատասխանության համար սովորական տեքստը պահանջում է նվազագույնը 4.5:1 հակադրության հարաբերակցություն, մինչդեռ մեծ տեքստը (18pt կամ 14pt հաստ)՝ 3:1։

WCAG AAA-ն պահանջում է ավելի բարձր հակադրության հարաբերակցություններ՝ 7:1 սովորական տեքստի և 4.5:1 մեծ տեքստի համար, մինչդեռ AA-ի համար դրանք համապատասխանաբար 4.5:1 և 3:1 են։

Օգտագործիր մեր ավտոմատ ուղղման գործառույթը՝ տեքստը կամ ֆոնը կարգավորելու համար՝ պահպանելով դիզայնի նպատակը, կամ ձեռքով կարգավորիր գույները HSL սահիչներով, որոնց տեսողական ցուցիչները ցույց են տալիս AA/AAA համապատասխանության օպտիմալ գոտիները։

Կանաչ գոտիներն ու AA/AAA նշիչները ցույց են տալիս WCAG համապատասխանության օպտիմալ միջակայքերը։ Ուղղորդող հուշումները (Ավելի բաց/Ավելի մուգ) օգնում են քեզ հասնել ավելի լավ հակադրության՝ կախված գույների ընթացիկ համակցությունից։

Այո, կարող ես մուտքագրել ցանկացած HEX գունային կոդ կամ օգտագործել գույնի ընտրիչը՝ սեփական գույները ընտրելու համար։ URL-ը ավտոմատ թարմացվում է, որպեսզի կարողանաս կիսվել գույների կոնկրետ համակցություններով։