OKLCH مقابل HSL: مقارنة هندسية ومتى تستخدم كل خيار
استوديو الألوان يجمع بين الدقة والسرعة: حوّل أي لون بين المساحات الشائعة، واستخرج الألوان المهيمنة من صورة، واختبر تباين النص على الخلفية وفق WCAG 2.1 وخوارزمية APCA، ثم ولّد سلم درجات متناسقًا لنظام التصميم الخاص بك. تتم جميع العمليات داخل ذاكرة المتصفح على جهازك عبر واجهات الويب القياسية دون إرسال أي بايت إلى خوادم خارجية.
| وجه المقارنة | OKLCH | HSL | استوديو الألوان |
|---|---|---|---|
| المعيار والبنية التقنية | CSS Color 4 · oklch(L C H) | sRGB Cylinder · hsl(H S% L%) | مساحات الألوان والسلالم ومستخرج الصور |
| الأداء والدقة العملية | Perceptually uniform L + P3 | Uneven perceived luminance | مدقق تباين WCAG 2.1 وAPCA |
| حالة الاستخدام المثلى | 50–950 Design Token Scales | Legacy sRGB-only pickers | سلم OKLCH والتناغمات وΔE ومصفوفة |
الخلاصة الهندسية: أيهما تختار؟
حوّل مساحات الألوان، وافحص تباين WCAG وAPCA، وابنِ سلالم ألوان. حساب نسبة التباين بدقة مع تحديد الدرجة التي تجتاز المعيار. درجة APCA من خوارزمية ما زالت قيد التطوير ولا تُعد بديلًا عن متطلبات WCAG 2.1 الرسمية. حكم دائمًا على النص الحقيقي وحجمه ووزنه.
أسئلة شائعة
ما نسبة التباين المطلوبة في WCAG AA؟
الحد الأدنى 4.5:1 للنص العادي و3:1 للنص الكبير (18pt عادي أو 14pt عريض). أما AAA فيتطلب 7:1 للنص العادي.
هل يكفي اجتياز نسبة التباين لضمان قابلية الوصول؟
لا، هو شرط واحد فقط. راجع أيضًا حجم الخط وتباعد الأسطر وحالة التركيز وعدم الاعتماد على اللون وحده لنقل المعلومة.
هل تُرفع ملفاتي أو نصوصي إلى خادم خارجي أثناء المعالجة؟
لا. تُعالج جميع المدخلات محليًا داخل تبويب المتصفح على جهازك، ولا تُحفظ أو تُنقل عبر الشبكة.