ตรวจสอบความคมชัดสีตาม WCAG

นี่คือตัวตรวจสอบคอนทราสต์สี WCAG ที่แสดงอัตราส่วนคอนทราสต์ที่แน่นอนระหว่างสีข้อความและสีพื้นหลัง และดูว่าตรงตามระดับการเข้าถึง AA และ AAA หรือไม่ เลือกสีด้วยสวอตช์หรือตามรหัสฐานสิบหก และดูตัวอย่างแบบสด

ปรับทั้งสองสีจนกว่าป้ายสถานะจะผ่านระดับที่คุณต้องการ และผลลัพธ์จะอัปเดตทันทีที่คุณไป

ข้อความที่อยู่ชิดพื้นหลังมากเกินไปจะทำให้อ่านยากหรืออ่านไม่ได้ โดยเฉพาะสำหรับผู้ที่มีปัญหาด้านการมองเห็นเลือนลางหรือบกพร่องด้านการมองเห็นสี หรือสำหรับใครก็ตามที่ใช้โทรศัพท์ในแสงแดดจ้า คอนทราสต์ที่เพียงพอทำให้เนื้อหาของคุณอ่านง่ายสำหรับทุกคน

แนวทางการเข้าถึงเนื้อหาเว็บ (WCAG) กำหนดมาตรฐาน AA ซึ่งเป็นระดับที่ไซต์ส่วนใหญ่ตั้งเป้าไว้และกฎหมายการเข้าถึงข้อมูลจำนวนมากอ้างอิง กำหนดให้ต้องมีอัตราส่วน 4.5:1 สำหรับข้อความปกติและ 3:1 สำหรับข้อความขนาดใหญ่ AAA จะเข้มงวดกว่าที่ 7:1 และ 4.5:1

ข้อความขนาดใหญ่จะมีเกณฑ์ที่ต่ำกว่าเนื่องจากตัวอักษรขนาดใหญ่จะอ่านได้ชัดเจนและมีคอนทราสต์น้อยกว่า โดยจะมีขนาดใหญ่ประมาณ 24px (18pt) หรือ 18.66px (14pt) เมื่อเป็นตัวหนา

อัตราส่วนนี้มาจากความสว่างสัมพัทธ์ของทั้งสองสีโดยใช้สูตร WCAG อย่างเป็นทางการ โดยให้ค่าตั้งแต่ 1:1 (ไม่มีสีที่ตัดกันและเหมือนกัน) ไปจนถึง 21:1 (สีดำบนพื้นขาว)

ทุกอย่างได้รับการคำนวณในเบราว์เซอร์ของคุณ ดังนั้นจึงรวดเร็วและเป็นส่วนตัว ไม่มีสิ่งใดที่คุณเลือกจะถูกอัปโหลดทุกที่