Color Models

HSL

نموذج لوني أسطواني يصف الألوان باستخدام الصبغة والتشبّع والفتوح، وهو مصمّم ليكون بديهياً في اختيار الألوان.

HSL represents color as an angle on the color wheel (hue, 0-360), a percentage of color intensity (saturation, 0-100%), and a percentage of lightness (0-100% where 0% is black and 100% is white). At 50% lightness, the pure hue is displayed. HSL is widely used in CSS (the hsl() function) because it makes it easy to create tints, shades, and tones by adjusting a single parameter. It is more intuitive than RGB for design work but has the limitation of not being perceptually uniform, meaning equal numeric changes do not always produce equal visual changes.

جرّبه الآن

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

حوّل بين تنسيقات الألوان HEX وRGB وHSL وHSV وCMYK وOKLCH على الفور.

المقالات ذات الصلة

دالة color-mix() في CSS: مزج الألوان محليًا في المتصفح

تعلّم color-mix() في CSS لمزج الألوان محليًا في المتصفح. أتقن البنية وفضاءات الألوان وحالات الاستخدام العملية وإنشاء لوحات ديناميكية بدون JavaScript.

بناء منتقي ألوان كـ Web Component من الصفر

أنشئ منتقي ألوان شاملًا كـ Web Component. نفّذ تصيير الـ canvas وشرائح hue وقنوات ألفا والأحداث المخصصة باستخدام Shadow DOM.

الفضاءات اللونية الإدراكية: Lab وLCH وOklab وOKLCH

استكشف الفضاءات اللونية الموحدة إدراكيًا — CIE Lab وLCH وOklab وOKLCH. تعرّف على تصميم كل منها وأين يتفوق وأيها تختار لعمل CSS والتصميم.

زمردي مقابل يشم مقابل أخضر الغابة: دليل مقارنة الألوان الخضراء

قارن الزمردي (#50C878) واليشم (#00A86B) وأخضر الغابة (#228B22). تعلّم الفروق البصرية وفي أكواد hex بين هذه الدرجات الخضراء الشائعة.

الفرق بين السيان والفيروزي

السيان (#00FFFF) والفيروزي (#40E0D0) يبدوان متشابهين لكنهما يختلفان في الموضع في نموذج الألوان والتشبع وحالة الاستخدام. إليك التحليل الكامل.

تصميم واجهة برمجة تطبيقات الألوان: نقاط نهاية REST لبيانات الألوان

صمّم واجهة برمجة RESTful للألوان مع نقاط نهاية لتحويل الألوان والبحث وفحص التباين وتوليد اللوحات. تعلّم تصميم المخطط وأفضل الممارسات.