مولّد لوحات الألوان

المخطّطات دورات حول عجلة الصبغة، مع تثبيت الإشباع والإضاءة. فالمتمّم على بعد 180°، والثلاثي ثلاثة ألوان تفصلها 120°، والمتجاور يأخذ الجارين المباشرين عند ±30°. وهي حساب بسيط — والقيمة في رؤية النتيجة لا في المعادلة.

وسلّم الدرجات الفاتحة والداكنة هو الجزء الذي ستشحنه فعلًا. عشر خطوات من 50 إلى 900، مع تثبيت الصبغة والإشباع والمشي بالإضاءة من 96% نزولًا إلى 18%. وهو العرف الذي جعله Tailwind معياريًا، وهو ما يتيح لك كتابة --brand-700 لحدّ و--brand-50 لخلفية تحويم وأن ينتمي أحدهما إلى الآخر.

ويُفحص التباين أثناء بناء السلّم. فالملاحظة تحت السلّم تخبرك أي خطوة هي أفتح واحدة تتجاوز 4.5:1 على الأبيض. وتلك الحقيقة وحدها تقرّر من أين يأتي لون نصّ متنك، وإيجادها بالتجربة والخطأ هو كيف تُعتمَد لوحة غير ميسَّرة قبل أن يلاحظ أحد.

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

تشغيل عملي. ابدأ من أخضر هويّة، #4d7c0f. يعطيك المخطّط الثلاثي أزرق وأرجوانيًا بتباعد متساوٍ — وهما صالحان سلسلتَي بيانات في رسم بياني لأنهما بالضبط متساويا البعد عن بعضهما وعن الأساس. ويعطيك السلّم عشرة أخضرات، وتخبرك الملاحظة أن 600 هي حيث يصير النص على الأبيض آمنًا.

والآن بدّل المعاينة إلى عمى الأخضر. وهو الشائع — نحو رجل من كل ستّة عشر. فإن انهار أخضرك وأحمرك إلى النغمة الموحلة نفسها، فقد تعلّمت للتوّ أن مؤشّر حالة مبنيًّا من هذين اللونين لا يوصّل شيئًا إلى ذلك القارئ. والإصلاح ليس أخضر مختلفًا أبدًا؛ بل إضافة إشارة ثانية، علامة صحّ وعلامة خطأ، وخطّ متّصل وخطّ متقطّع، وكلمة.

ولماذا تبدو المخطّطات المتجاورة راقية والثلاثية صاخبة. فالصبغات المتجاورة تتقاسم الضوء، فتُقرأ لوحةً واحدة مدروسة. أما الصبغات المتساوية التباعد فتطلب كلٌّ منها انتباهًا متساويًا، وهو صحيح للبيانات وخاطئ لصفحة. ومنتقي المخطّطات يستحق المرور عليه باللون الأساس نفسه لترى هذا وحسب.

وانسخ CSS فيكون لديك نظام تصميم مبدئي. فكتلة المخرجات خصائص مخصّصة، جاهزة للّصق في قاعدة :root — السلّم بأسماء --brand-50 حتى --brand-900، وألوان التناغم لهجاتٍ.

افحص أي اقتران بعينه في فاحص التباين، أو حوّل قيمة مفردة بـمحوّل الألوان.