تشغيلي

مدقق تباين الألوان

إعلان

Preview

Normal Text (16px)

Large Text (24px)

Contrast Ratio

21.00:1

WCAG Compliance

Normal Text

AA Pass
AAA Pass

Large Text (18pt+ or 14pt+ bold)

AA Pass
AAA Pass

UI Components & Graphics

AA Pass

WCAG Standards

Normal Text

  • AA: 4.5:1 minimum
  • AAA: 7:1 minimum

Large Text

  • AA: 3:1 minimum
  • AAA: 4.5:1 minimum

UI Components

  • AA: 3:1 minimum

Common Combinations

Black on White
White on Blue
White on Dark Gray
أدخل مجموعات الألوان الخاصة بك أدناه لاختبارها باستخدام مدقق تباين الألوان الخاص بنا ومعرفة ما إذا كانت تلبي معايير إمكانية الوصول على الفور.
إعلان

كيف يعمل مدقق تباين الألوان لدينا

أدخل ألوان المقدمة والخلفية باستخدام قيم RGB سداسية، أو اخترها مباشرة باستخدام Color Picker.

 يمكنك:

  • قم بضبط ألفا لتغيير مدى شفافية لون المقدمة.
  • استخدم شريط الإضاءة لجعل اللون يبدو أفتح أو أغمق.

ثم تقوم أداتنا بحساب نسبة التباين والتحقق منها مع إرشادات WCAG:

  • مستوى AA في WCAG 2.0
  • على الأقل 4.5:1 للنص الأساسي العادي
  • على الأقل نسبة 3:1 للنصوص الكبيرة
  • WCAG 2.1 (واجهة المستخدم والرسومات)
  • على الأقل بنسبة 3:1 للأيقونات والحدود ومكونات الواجهة الأخرى
  • مستوى WCAG AAA
  • على الأقل بنسبة 7:1 للنص العادي
  • على الأقل 4.5:1 للنصوص الكبيرة

النص الكبير يعني إما:

  • 14 نقطة (حوالي 18.66 بكسل) وعريضة، أو
  • 18 نقطة (حوالي عدد العرض) أو أكبر

يمكنك استخدام قطارة العين في اختيار الألوان لالتقاط ألوان دقيقة من أي شيء على شاشتك. يجعل من السهل اختبار التصاميم الحقيقية أو الأزرار أو الخلفيات.

للروابط التي تعتمد فقط على اللون لتبرز، استخدم مدقق تباين الألوان الخاص بنا للتأكد من أنها تلبي معايير الوصول وتبقى سهلة القراءة للجميع.

 
 

وثائق واجهة برمجة التطبيقات (API) ستتوفر قريباً

Documentation for this tool is being prepared. Please check back later or visit our full API documentation.