ImageColorPicker.com

Өнгөний ялгарал шалгагч

Урд болон арын өнгөний ялгаралтын харьцааг шалгаж, хүртээмжийг хангана уу.

Өнгөө шалга

Текст унших боломжтой байдлыг хангахын тулд WCAG хүртээмжийн стандартыг хангаж байгаа эсэхийг шалгахын тулд өнгөний хослолыг туршина уу.

18.88 1-тэй
Ялгарал
AAA
Текстийн үр дүн
Гайхалтай

Харьцуулсан: #000000 нь #F5F2F4 дээр

Текст

16px, Энгийн (400)

Энгийн текстэд тооцогдоно.

  • AA (WCAG 1.4.3): дор хаяж 4.5:1

    Тэнцсэн

  • AAA (WCAG 1.4.6): дор хаяж 7:1

    Тэнцсэн

UI бүрэлдэхүүн хэсэг, график

Икон, оролтын хүрээ, фокусын заагч болон интерфэйс ашиглахад харах шаардлагатай бусад элементүүд.

  • AA (WCAG 1.4.11): дор хаяж 3:1

    Тэнцсэн
18.88 харьцаа 1. Текст: AA-г давж байна, AAA-г давж байна. UI бүрэлдэхүүн хэсгүүд: давж байна.
Яаж шалгадаг вэ
Харьцуулсан өнгө (холилсны дараа)
Текст #000000 нь фон #F5F2F4 дээр
Харьцангуй люминанс
Текст 0.0000, фон 0.8944
Томъёо
(L1 + 0.05) / (L2 + 0.05) энд L1 нь илүү тод өнгийн люминанс, L2 нь илүү бараан өнгийнх юм.
Яг харьцаа
18.8896 харьцаа 1, 18.88 харьцаа 1 гэж харуулсан. Үзүүлсэн утгыг огтлож харуулдаг, тойруулдаггүй тул үнэнээсээ сайхан харагддаггүй. Яг утга нь шаардлагатайтай харьцуулахад ашиглагддаг.

Текстийн хэмжээ: 16px, Энгийн (400)

Энгийн текстэд тооцогдоно. Том текст нь дор хаяж 24px (18pt) эсвэл тод (зузаан 700 ба түүнээс их) үед дор хаяж 18.67px (14pt) байна. Хэмжээг тойруулалгүй, тасалсан байдлаар харуулна.

Энгийн текстэд тооцогдоно. Том текст нь дор хаяж 24px (18pt) эсвэл тод (зузаан 700 ба түүнээс их) үед дор хаяж 18.67px (14pt) байна. Хэмжээг тойруулалгүй, тасалсан байдлаар харуулна.

Aa
Урьдчилан харах гарчиг

Хурдан бор үнэг залхуу нохой дээгүүр үсрэв

Жижиг текстийн жишээ (12px)

Текст
#000000
Дэвсгэр
#f5f2f4

WCAG стандартууд

Түвшин AA

Энгийн текстийн хувьд хамгийн бага харьцаа нь 4.5:1 ба том текстийн хувьд 3:1 байх шаардлагатай. Ихэнх вэбсайтуудад заавал шаардлагатай.

Түвшин AAA

Энгийн текстийн сайжруулсан харьцаа нь 7:1 ба том текстийн хувьд 4.5:1. Оновчтой хандалтын тулд зөвлөмжид оруулсан.

Өнгөний ялгарал шалгагч

Текст болон арын өнгөний ялгаралтын харьцааг тооцоолно уу.

Текст болон фонны өнгийг зөвшөөрөгдсөн харьцаа (e.g., #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.

Дизайны санаагаа хадгалан текст эсвэл арын өнгийг тохируулахын тулд манай автомат засварын функцийг ашиглах, эсвэл AA/AAA нийцлийн оптимал бүсийг харуулсан харагдах заалттай HSL гулсуураар гараар тохируулах боломжтой.

Ногоон бүс болон AA/AAA тэмдэглэгээ нь WCAG нийцэлд хүрэх оптимал муж харуулна. Чиглэлийн зөвлөмж (Цайвар/Бараан) таны одоогийн өнгөний хослолд тулгуурлан илүү сайн ялгаралт руу чиглүүлнэ.

Тийм, та дурын HEX кодыг оруулах эсвэл өнгөний сонгогчийг ашиглан өөрийн өнгөө сонгож болно. URL автоматаар шинэчлэгдэх тул тодорхой өнгөний хослолыг хуваалцаж болно.