محول HSL إلى HWB

يصف نموذج HSL اللون بالتدرج على العجلة، والتشبع بمدى حيوية المزيج، والإضاءة بمدى قربه من الأسود أو الأبيض. يستخدم HWB التدرج نفسه ثم يسمّي مقدار الأبيض ومقدار الأسود الممزوجين بالتدرج النقي. من يختار الألوان أصلًا بـ HSL يحتاج غالبًا إلى HWB عند كتابة دوال hwb() في CSS Color Module، أو عند مخاطبة أدوات الرسم التي تعرض منزلقات البياض والسواد، أو عند توثيق عيّنة على أنها صبغة مع ظل. يأخذ هذا المحول التدرج بالدرجات من صفر إلى ثلاثمئة وستين والتشبع والإضاءة كنسب مئوية من صفر إلى مئة، ثم يعيد ثلاثي HWB المطابق مع سلسلة CSS بصيغة hwb().

كيف يُسقَط HSL على التدرج والبياض والسواد

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

على الفترة الوحدوية يكون الإسقاط مغلق الصيغة ولا يحتاج إلى المرور بـ RGB الصحيح: الكروم يساوي واحدًا ناقص القيمة المطلقة لضعف الإضاءة ناقص واحد، مضروبًا كله في التشبع؛ البياض هو الإضاءة ناقص نصف الكروم؛ والسواد هو واحد ناقص الإضاءة ناقص نصف الكروم. وهذا يعادل اتخاذ أصغر قناة RGB أبيضًا وواحدًا ناقص أكبر قناة RGB أسودًا، وهو تعريف HWB في CSS Color Module Level Four. عندما يكون التشبع صفرًا يختفي الكروم فيصير البياض والسواد نسبًا مئوية متكاملة مجموعها مئة وتصف رماديًا أو أسود أو أبيض.

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

ما ترسله وما تستقبله

أرسل ثلاثة أرقام منتهية تحت الحقول h وs وl. الحقل h هو التدرج بالدرجات وهو مطلوب؛ ويجب أن يقع بين صفر وثلاثمئة وستين شمولًا لأن HSL وHWB يشتركان في تلك الزاوية ولن يخترع هذا المحول لفًّا. الحقلان s وl هما التشبع والإضاءة كنسب مئوية من صفر إلى مئة.

عندما يخرج التشبع عن صفر إلى مئة توضح الاستجابة أن s يجب أن يكون نسبة مئوية في ذلك النطاق المغلق حتى يتمكن العميل من تقييد الرمز أو إصلاحه قبل إعادة المحاولة؛ وتنطبق القاعدة نفسها على الإضاءة. عند النجاح تعيد الاستجابة قيم h وs وl المنظّفة، وتُبلغ عن البياض w والسواد b كنسب مئوية، وتعشّش كائن hsl المصدر وكائن hwb الناتج، وتصدر سلسلة CSS قابلة للطباعة بالشكل hwb(H W% B%)، وتتضمن ملاحظة صيغة قصيرة تعيد صياغة هويات الكروم.

تشمل الفحوصات الكلاسيكية الأزرق السماوي متوسط النبرة عند تدرج مئتين وعشرة وتشبع ثمانين وإضاءة خمسة وأربعين فيُسقَط إلى تسعة بالمئة أبيض وتسعة عشر بالمئة أسود؛ والأحمر النقي بتدرج صفر وتشبع مئة وإضاءة خمسين فيُسقَط إلى صفر أبيض وصفر أسود؛ وأي تدرج بتشبع صفر ينهار إلى مزيج عديم اللون مجموع بياضه وسواده مئة. استخدم نموذج المتصفح المجاني لاستكشاف اللوحات ومراجعات التصميم، ثم استدعِ العقد نفسه من السكربتات عندما تحتاج تحويلًا جماعيًا لرموز HSL إلى جداول HWB أو مثبتات انحدار.

أين يظهر تحويل HSL إلى HWB في العمل الحقيقي

غالبًا ما تؤلف أنظمة التصميم منحدرات العلامة بصيغة HSL حتى تتمكّن فرق المنتج من تدريج الإضاءة لتباين ميسر مع الإبقاء على التدرج ونطاق التشبع ثابتين؛ ومع ذلك تعرض أوراق الأنماط الحديثة وتطبيقات الرسم وعدة منتقيات أصلية HWB لأن مزج تدرج نقي بالأبيض والأسود يطابق حديث الرسامين عن الصبغات والظلال. يحتاج مهندسو الواجهة الذين ينقلون رمزًا من خصائص hsl() المخصصة إلى hwb() إلى مرجع حتمي لا يعتمد على تسلسل النمط المحسوب في متصفح بعينه.

ولا تزال أدوات تصور البيانات والفن التوليدي التي تبني لوحات فئوية بخطوة التدرج عند تشبع وإضاءة ثابتين مضطرة إلى إفراغ HWB عندما يطلب محرك عرض أو خط طباعة البياض والسواد بدل محور إضاءة ثالث. تحتاج المناهج ودروس المعسكرات إلى مفتاح موثوق واحد للواجبات يطابق هويات CSS Color Module لا لقطة لمنتقي ألوان، وهي تعلّم النماذج الأسطوانية جنبًا إلى جنب. ولا تزال مسارات إمكانية الوصول التي تضبط الإضاءة المدرَكة في HSL ثم تسلّم إلى محرر قائم على HWB تحتاج إلى إسقاط دقيق للقنوات دون واجهات تقتصر على المتصفح.

إذا احتجت لاحقًا تحويل HSL إلى RGB أو HSL إلى HSV أو تحويلًا متعدد الصيغ بين HEX وLAB وCMYK أو فحوصات تباين WCAG، فاعاملها كنوايا بحث وصفحات هبوط منفصلة بدل إثقال صفحة محول HSL إلى HWB المخصصة هذه.