ตัวตรวจสอบความตัดกันของสี
ตรวจสอบอัตราส่วนความตัดกันตามมาตรฐาน WCAG ระหว่างสี hex สองสี และดูว่าคู่สีนั้นผ่านมาตรฐานการเข้าถึง AA และ AAA หรือไม่
เครื่องมือนี้ตอบคำถามของคุณหรือไม่
ขอบคุณ — ความเห็นนี้ช่วยให้เราปรับปรุงเครื่องมือ
วิธีใช้เครื่องมือนี้
- กรอกสีพื้นหน้า (ข้อความ) และสีพื้นหลังเป็นรหัส hex
- เครื่องมือจะคำนวณค่าความสว่างสัมพัทธ์ตาม WCAG ของแต่ละสี
- อ่านอัตราส่วนความตัดกันและผลลัพธ์ผ่าน/ไม่ผ่านสำหรับเกณฑ์ AA และ AAA
ตรวจสอบว่าสีสองสีตรงตามข้อกำหนดความตัดกันของ WCAG 2.1 หรือไม่ อัตราส่วนขั้นต่ำคือ 4.5:1 สำหรับข้อความปกติ (AA) และ 7:1 สำหรับมาตรฐานสูงสุด AAA
สูตร
For each hex color, compute relative luminance L using the WCAG formula:L = 0.2126 × lin(R) + 0.7152 × lin(G) + 0.0722 × lin(B)
where lin(c) = c/12.92 if c ≤ 0.03928, else lin(c) = ((c + 0.055)/1.055)2.4.
Contrast ratio: ratio = (Llighter + 0.05) / (Ldarker + 0.05)
WCAG thresholds: AA normal text ≥ 4.5:1; AA large text ≥ 3.0:1; AAA normal text ≥ 7.0:1; AAA large text ≥ 4.5:1.
คำถามที่พบบ่อย
- อัตราส่วนความตัดกันของ WCAG คืออะไร?
- WCAG (Web Content Accessibility Guidelines) กำหนดสูตรอัตราส่วนความตัดกัน มีค่าตั้งแต่ 1:1 (ไม่มีความตัดกัน) ถึง 21:1 (ดำบนขาว) ข้อความเนื้อหาปกติต้องมีอัตราส่วนอย่างน้อย 4.5:1 เพื่อให้ผ่านมาตรฐาน AA
- อะไรนับเป็นข้อความขนาดใหญ่?
- ข้อความขนาดใหญ่คือขนาด 18pt (24px) ขึ้นไป หรือ 14pt ตัวหนา (ประมาณ 19px ตัวหนา) ข้อความขนาดใหญ่ต้องการอัตราส่วนเพียง 3:1 สำหรับ AA