-->

الأحد، 19 يناير 2020

أكواد اللون : تعرف على الفرق بين Hex و RGB و HSL ؟

عندما يتعلق الأمر برش اللون على الشاشة ، هناك عدة طرق للقيام بذلك مع الترميز. Hex و RGBA و HSLA هي ثلاثة من أنظمة الأكواد اللونية الأكثر استخدامًا.
ربما واجهت رموزًا سداسية عشرية و RGB في الماضي ، لكن HSL ، على الرغم من كونها أكثر قابلية للقراءة البشرية ، ربما لم تكن موجودة على الرادار الخاص بك حتى الآن. كل طريقة لكتابة الألوان لأسفل منطقية في المواقف المختلفة ، وكل ما تحتاجه هو فهم أساسي لكل نوع لاتخاذ قرار مستنير. سنشرح هنا الاختلافات بين RGB و HEX و HSL.
ما هو RGB (الأحمر والأخضر والأزرق)
نماذج الألوان Rgb
من المنطقي أن نبدأ بقيم RGB ، لأن الأحمر والأخضر والأزرق هي الألوان الثلاثة التي يمكن أن تستخدمها الشاشات لإنتاج كل الألوان الأخرى. يتم ذلك باستخدام "مزج الألوان المضافة" ، لكن لا يتعين عليك الخوض في علم ذلك لفهم RGB.
نماذج الألوان Rgba
rgb(255, 0, 0) باللون الأحمر ، حيث بلغ الحد الأقصى لـ R. إذا قمت بتعيين إما G أو B على 255 ، فسوف تحصل على اللون الأخضر الكامل أو الأزرق الكامل. اضبطها جميعًا على 255 مرة واحدة وستحصل على اللون الأبيض (مجموع كل الألوان) ، في حين يصبح التصفير منها أسود. إذا قمت بإضافة قيمة رابعة (قناة ألفا ، بين 0 إلى 1) ، يمكنك أيضًا الحصول على الشفافية: rgba(0, 0, 0, .5) إلى أسود نصف شفاف.
الأمر بسيط ، نعم ، لكن ليس بهذه البديهية. يمكن أن يتغير توازن RGB قليلاً حتى إذا كنت تقوم فقط بتغيير ظلال اللون ، مما يجعل من الصعب للغاية على البشر إجراء معايرات يدوية دون وجود نوع من مُنشئ RGB (يوجد الكثير منهم ، لحسن الحظ ، الكثير).
ما هي رموز اللون السداسية العشرية
نماذج الألوان شفاف عرافة
الهيكس هي مجرد طريقة مختلفة لكتابة قيم RGB. هناك شيء مثل #6a79f7 (أزرق الذرة) يرسم مباشرة إلى rgb(106, 121, 247) . 6 أ هو الأحمر ، 79 هو الأخضر ، و f7 هو الأزرق .
أولاً ، يجب أن تعلم أنه في نظام الألوان السداسي ، تمثل الأحرف "af" الأرقام من عشرة إلى خمسة عشر. ثانياً ، ست عشري ، وهذا يعني أن كل شيء موجود في الأساس 16 . 21 هي 2 * 10 + 1 في قاعدة 10 ، ولكن في الست عشري سيكون 2 * 16 + 1 . ما عليك سوى ضرب الرقم الأول في 16 وإضافة الرقم الثاني - إنه سهل بنفس السهولة! 6a = 6 * 16 + 10 أو 106. 79 = 7 * 16 + 9 أو 121.
نماذج الألوان Hex Chart
على الرغم من أن الرياضيات ممتعة ، إلا أنها تجعل الأكواد السداسية العشرية أكثر وضوحًا بالنسبة للألم أكثر من RGB ، على الرغم من أنها سهلة النسخ واللصق ويمكن أن تحتوي على مجموعات حروف / أرقام لا تنسى.
يمكنك أيضًا إضافة شفافية إلى رموز سداسي عشرية عن طريق وضع قيمة مكافئة لبعض النسبة المئوية من 255 في البداية ، مثل: #806a79f7 . 80 بالسداسي عشري = 126 ، وهو قريب من 50٪ من الحد الأقصى للقيمة 255.
ما هو HSL (تدرج اللون ، التشبع ، الخفة)
نماذج الألوان Hsl
تم تصميم HSL إلى حد كبير لسهولة القراءة البشرية ، واكتسب شعبية خاصة كبديل RGB. يعمل مثل هذا:
تدرج اللون هو اللون ، ويستخدم درجات عجلة الألوان لإخبارك بالألوان التي أنت عليها. إذا كنت تعرف عجلة الألوان ومواقع هذه الألوان الرئيسية ، يجب أن تكون قادرًا على معرفة أن 45 ستبدو برتقالية و 270 ستبدو أرجوانية فقط من خلال التفكير فيها لفترة ثانية.
عجلة الألوان RGB
0 = أحمر
60 = أصفر
120 = أخضر
180 = سماوي
240 = أزرق
300 = أرجواني
التشبع هو في الأساس لون الألوان. 0٪ تشبع يعني أن اللون سيكون مجرد ظلال رمادية ، بينما يعني 100٪ أنه سيظهر قوة كاملة. إذا كنت ترغب في كتم لونك أو جعله يطفو على السطح أكثر من ذلك بقليل ، يمكنك فقط تغيير هذه القيمة.
يخبرك Lightness بمدى اللون أو لونه. تعني نسبة الإضاءة الخافتة 0٪ أن لونك سيكون أسودًا ، بغض النظر عن إعدادات Hue أو Saturation ، و 100٪ من خفة الإضاءة ستحصل على اللون الأبيض. كما كنت قد خمنت ، 50 ٪ يعطيك اللون الأكثر دقة.
نماذج الألوان Hsla
باستخدام هذه المعلومات ، يجب أن تكون قادرًا على معرفة ما يعنيه hsl(0, 100%, 50%) على الفور. إنه أحمر فقط! نريد احمرار ، أغنى ثراء؟ حاول 0, 70%, 40% . ربما تريد ذلك ، ولكن باللون الأزرق؟ مجرد تغيير 0 إلى 240 وكنت قد حصلت عليه! لها شفافية أيضًا - تعمل تمامًا مثل RGB: فقط أضف قيمة رابعة (بين 0 و 1) ، مثل: hsla(240, 70%, 40%, .5) .
نماذج الألوان Hsv
ماذا؟ المزيد من نماذج الألوان؟ متى ينتهي؟ بالنسبة لمعظم الأشخاص الذين يعملون مع الألوان على أجهزة الكمبيوتر ، فقد انتهى الأمر بالفعل. تعد Hex و RGB و HSL أكثر الطرق شيوعًا لتدوين الألوان. إذا كنت تعمل في حقل يتضمن الكثير من الصور والألوان ، على سبيل المثال ، مثل التصميم الجرافيكي أو تعلم الآلة على الصور ، فيمكنك تشغيل أشخاص يستخدمون أحد نماذج الألوان الباطنية هذه ، أو حتى أحد النماذج الأخرى غير المدرجة هنا.
يرمز HSB إلى "درجة تشبع اللون" و HSVs تعني "قيمة تشبع اللون". إنها في الواقع مجرد أسماء مختلفة للنموذج نفسه ، وأكبر فرق لها من HSL هو في كيفية تعريف التشبع. لدى HSI (كثافة تشبع اللون) بعض الاختلافات الطفيفة عن HSB / HSV ، ولكنها ليست مستخدمة على نطاق واسع ، لذلك الاحتمالات أنك لن ترى في البرية كثيرًا.
ما هو نموذج الألوان الذي يجب استخدامه؟
بشكل عام ، يعد اختيار نموذج لون قرارًا بسيطًا إلى حد ما في التصميم ، ولكن يتم اتخاذ الأشياء الجيدة من خلال العديد من القرارات الصغيرة. بشكل عام ، تُسهل أكواد سداسي عشرية لصق النسخ وهي رائعة في المواقف التي قد لا يشارك فيها البشر كثيرًا. تعتبر RGB / RGBA مناسبة لقابلية القراءة ويتم استخدامها على أفضل وجه عندما يكون من الجيد إذا كان الإنسان يمكن أن يقوم في بعض الأحيان بتعديل الشفافية. إذا احتاج الإنسان إلى تغيير اللون يدويًا ، فانتقل إلى HSL / HSLA. بخلاف ذلك ، إنها مسألة تفضيل إلى حد كبير ، على الرغم من أن الأشخاص في فريق HSL يميلون إلى أن يكونوا أكثر ذكاءً وأفضل.
تعليقات فيسبوك
0 تعليقات بلوجر

ليست هناك تعليقات:

إرسال تعليق

إتصل بنا

الإسم الكريم البريد الإلكتروني مهم الرسالة مهم