ออกแบบ

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

อัตราคอนทราสต์ WCAG สำหรับสองสี

เกือบจะไม่ทันรู้ตัว เราก็ลอยขึ้นจากพื้นแล้ว
1.00
อัตราส่วนคอนทราสต์
มาตรฐานข้อความปกติข้อความขนาดใหญ่
WCAG AA
WCAG AAA
WCAG 1.4.11องค์ประกอบที่ไม่ใช่ข้อความ/UI (≥3:1): —

สีข้อความทางเลือกระดับ AA ที่ใกล้ที่สุดกำลังคำนวณสีทางเลือกแบบ OKLCH…

รายงานนี้เป็นไปตามข้อกำหนดอัตราส่วนความเปรียบต่าง WCAG 2.2 ส่วน APCA ยังอยู่ในขั้นทดลองและไม่ใช่ผลการรับรอง WCAG 3

เลือกสี? ตัวแปลงสี · ประวัติโซเชียล: เครื่องมือสร้างข้อความสวยงาม · ตาชั่ง: เครื่องมือสร้างเฉดสี.

วิธีใช้

เลือกสีข้อความและสีพื้นหลัง อัตราส่วนความคมชัดและผ่าน/ไม่ผ่านสำหรับแต่ละระดับ WCAG จะอัปเดตสด พร้อมตัวอย่าง

คำถามที่พบบ่อย

อัตราส่วนคอนทราสต์ที่ดีคืออะไร

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

อะไรนับเป็นข้อความขนาดใหญ่?

ข้อความขนาดใหญ่ประมาณ 18pt (24px) หรือ 14pt (18.66px) ตัวหนาและใหญ่กว่านั้น

คำนวณอัตราส่วนอย่างไร?

จากความสว่างสัมพัทธ์ของทั้งสองสี: (สีสว่าง + 0.05) ÷ (สีเข้ม + 0.05) ตามสูตร WCAG

อัปเดตล่าสุด: