Skip to main content

مُحسّن لوحة الألوان إنشاء مجموعات ألوان تتوافق مع متطلبات التباين في WCAG.

مُحسّن لوحة الألوان illustration
🎨

مُحسّن لوحة الألوان

إنشاء مجموعات ألوان تتوافق مع متطلبات التباين في WCAG.

1

تعيين الخلفية

أدخل لون خلفيتك.

2

اختر مستوى WCAG

حدد هدف التوافق AA (4.5:1) أو AAA (7:1).

3

استعراض والنسبة

انظر الألوان المتوافقة مع نسب التباين وانسخها.

Loading tool...

What Is مُحسّن لوحة الألوان?

مُولِّد لوحة الألوان المتاح يجد الألوان التي تتوافق مع متطلبات التباين في إرشادات الويب للمكفوفين (WCAG) ضد لون الخلفية المختار. بدلاً من اختبار الألوان الفردية يدويًا، يقوم هذا الأداة بفحص طيف الألوان ويعرض فقط الألوان التي تحقق نسبة التباين المستهدفة (التصنيف AA عند 4.5:1 أو التصنيف AAA عند 7:1). يتم عرض كل لون مع معاينة مباشرة للنص ضد خلفيته ونسبة تباينه الدقيقة، مما يسهل العثور على ألوان متوافقة وتتناسب أيضًا مع جماليات التصميم. هذا يحل واحد من أكثر التحديات شيوعًا في تصميم الإمكانية الوصول: إيجاد الألوان التي تكون جذابة بصريًا ومتوافقة مع معايير الإمكانية الوصول. يقوم المُولِّد بمسح درجات اللون ومستويات الضوء لتوفير مجموعة متنوعة من الخيارات المتاحة.

Why Use مُحسّن لوحة الألوان?

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

Common Use Cases

تصميم ويب قابل للوصول

ابني لوحات الألوان التي تلبي متطلبات WCAG من البداية.

إنشاء نظام التصميم

أгенر ألوان نص قابلة للوصول لكل خلفية في نظامك.

مشاريع العملاء

قدم لعملائك خيارات الألوان التي تم التحقق منها مسبقًا للوصول إليها.

التصحيح

ابحث عن بدائل قابلة للوصول عندما تفشل الألوان الحالية في اختبارات التباين.

Technical Guide

يعيد المُولِّد تشغيل زوايا الدرجة (0-360° عند فترات زمنية 30°) ومستويات الإضاءة (10-90% عند فترات زمنية 10%) مع تشبع ثابت يبلغ 70%.对于 كل لون تم إنشاؤه، يحسب نسبة تباين WCAG ضد الخلفية المحددة باستخدام صيغة اللمعان النسبي. يتم جمع الألوان التي تتوافق مع الحد الأدنى من عتبة النسبة، وفرزها حسب نسبة التباين (الأعلى أولاً)، وعرضها على المستخدم. يغطي الخوارزمية طيف الدرجات الكامل، مما يضمن خيارات ألوان متنوعة. تشير نسب التباين الأعلى إلى قراءة أفضل. تعتمد العتبات الدنيا على معايير نجاح WCAG 2.1 1.4.3 (AA) و 1.4.6 (AAA).

Tips & Best Practices

  • 1
    ابدأ بلون خلفيتك واعثر على ألوان نص قابلة للوصول - وليس العكس
  • 2
    对于 الخلفيات الداكنة، تميل الألوان القابلة للوصول إلى أن تكون أفتح؛ للخلفيات الفاتحة، أدكن
  • 3
    نسب التباين الأعلى دائمًا أفضل - استهدف أعلى من الحد الأدنى عند الإمكان
  • 4
    تذكر اختبار الألوان القابلة للوصول مع محاكاة عمى الألوان أيضًا
  • 5
    احتفظ بلوحتك القابلة للوصول صغيرة (4-6 ألوان) لتحقيق الاتساق

Related Tools

Frequently Asked Questions

Q ما الذي يجعل اللون قابلاً للوصول؟
اللون قابل للوصول عندما يكون له تباين كافٍ ضد خلفيته. يتطلب WCAG AA ≥4.5:1 لنص عادي، ويتطلب AAA ≥7:1.
Q لماذا يتم استبعاد بعض الألوان من النتائج؟
لا يمكن لبعض تركيبات الدرجة اللونية / الإضاءة تحقيق التباين المطلوب ضد خلفيتك المحددة. على سبيل المثال، يفشل نص أصفر على أبيض في اختبار AA عند معظم درجات الإضاءة.
Q هل يجب أن أستهدف دائمًا توافق AAA؟
AAA (7:1) هو الأفضل ولكن ليس مطلوبًا قانونيًا دائمًا. تتطلب معظم قوانين الوصول إلى AA (4.5:1) التوافق. استهدف AAA عندما يكون ذلك ممكنًا، لكن AA هو المعيار القياسي.

About This Tool

مُحسّن لوحة الألوان is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.