منذ الأيام الأولى لتطوير الويب  كانت هناك طرق لتحديد الألوان في الخلفيات والحدود والخطوط والعناصر الأخرى، ويستخدم بعض الأشخاص كلمات رئيسية مدعومة بالألوان، بينما يستخدم أشخاص آخرون نظام ألوان أكثر تحديدًا مثل نظام HSL (تدرج الألوان، التشبع، الخفة). ومع ذلك، سنتحدث اليوم عن أكثر عن اصطلاحات تسمية اللون شيوعًا، وهي الكود اللوني الأساسي RGB والكود اللوني الست عشري (hex).1

الكود اللوني الأساسي RGB

الكود اللوني RGB

تعتبر رموز الألوان RGB، التي يشار إليها أحيانًا بالرموز الملونة RGBA عندما تتضمن قيمة إضافية لقناة ألفا، إحدى الطرق الأكثر شيوعًا لتعريف الألوان في صفحات الويب. وتكون مكتوبة بالطريقة التالية:

color: rgb(0, 0, 0); /* black */

color: rgb(255, 255, 255); /* white */

RGB أصل هذه التسمية من الألوان الأساسية، الأحمر والأخضر والأزرق في نظرية الألوان التقليدية، إذ يمكن أن تشتق جميع الألوان الأخرى من مجموعات من هذه الثلاثة. وكان يعتقد أن هذه الألوان الثلاثة لا يمكن تشكيلها بمزيج من أي ألوان أخرى.

الكود اللوني الست عشري HEX

في الواقع، يستخدم الكود اللوني الست عشري نفس مبدأ رموز الألوان RGB، حيث أنهما يحددان الألوان باستخدام صيغة ألوان RGB ولكنها تكون مكتوبة بطريقة مختلفة قليلًا:

color: #000000; /* black */

color: #FFFFFF; /* white */

مزايا استخدام الكود اللوني الست عشري

  • هو أكثر إحكامًا وترابطًا: وبالتالي فهو أفضل بالنسبة للكود المصغر، كما يمكن أن تصبح رموز اللون العشري أكثر تعقيدًا باستخدام ثلاثة أرقام فقط لبعض الألوان، بدلاً من الأرقام الستة الكاملة.
  • يحسن وقت تحميل صفحة الويب قليلًا: تتعامل أجهزة الكمبيوتر مع الأرقام الثنائية، ويمكن بسهولة تحويل رقم ست عشري إلى أربعة أرقام ثنائية، بينما تستغرق الأرقام العشرية وقتًا أطول للتحويل.
  • يسهل نسخه من البرامج المختلفة التي تحتوي على لوحة الألوان المستخدمة: حيث تتم كتابته كقيمة واحدة بدلاً من ثلاث قيم منفصلة، ومن المرجح استخدامه في أنظمة الألوان لأنه أصبح المعيار للاستخدام في HTML و CSS.

تحويل الكود اللوني RGB إلى الكود اللوني
الست عشري Hex Color Codes

تعتمد قيم الكود اللوني RGB على نظام الأرقام الذي نعرفه أكثروهو نظام الأرقام العشري، ونظام الأرقام العشري هو نظام Base-10، وهذا يعني أن هناك 10 أحرف فريدة تستخدم لتعريف الأرقام، والأحرف  المستخدمة هي الأرقام 0 – 9.

وتستند قيم الكود اللوني الست عشري إلى نظام الأرقام السداسية العشرية، ونظام الأرقام الست عشري هو نظام Base-16، وهذا يعني أنه يوجد 16 حرفًا فريدًا يُستخدم لتعريف الأرقام، الأحرف المستخدمة هي الأرقام 0 – 9، والأحرف A – F.

يتم العد بنفس الطريقة في كلا النظامين، الرقم الأول هو 0، وبالتتالي حتى الرقم الأخير. بالنسبة لنظام الأرقام العشري، يكون هذا الرقم هو 9. بالنسبة لنظام الأرقام السداسي، يكون هذا الرقم هو F.

أحيانًا تتم كتابة 0 بادئة أمام هذه القيم، وبمجرد الوصول إلى الرقم الأخير يمكنك بدء العد، وهذه المرة مع الرقم الرئيسي الخاص بك كما هو الحال في النظام التالي (والذي هو 1، لكل من نظام الأرقام العشري و الست عشري).

يوجد أدناه مثال يساعد على إظهار الاختلاف في نظامي الرقمين:

العشري 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

الست عشري 0 1 2 3 4 5 6 7 8 9 A B C D E F

لتحويل كود لوني RGB إلى كود لوني ست عشري، ستحتاج إلى تحويل كل من القيم بشكل فردي.

تحويل الكود اللوني الست عشري إلى الكود اللوني RGB

على الرغم من فوائد استخدام رموز اللون الست عشري، هناك أوقات قد ترغب في استخدام الكود اللوني RGB بدلاً من ذلك.

تحويل الكود اللوني الست عشري إلى الكود اللوني RGB هو في الواقع أكثر بساطةً قليلًا، حيث ستحتاج إلى عكس الطريقة السابقة.

بغض النظر عن الطريقة التي تفضلها، تعتمد الأكواد اللونية RGB و hex على مزيج وكثافة ثلاثة ألوان لإنشاء العديد من الألوان المختلفة. ومع ذلك فإن الألوان الموجودة على شبكة الإنترنت تمتزج مع بعضها بشكل مختلف عن ما قد تتوقعه من مزج ألوان الطلاء معًا. مثال:

أخضر + أزرق = سماوي.

أحمر + أزرق = أرجواني.

أحمر + أخضر = أصفر.

قد تتعرف على هذه الألوان من طريقة أخرى لتحديد اللون في التصميم، والمعروفة باسم CMYK، والتي تستخدم للطباعة. ويفضل بعض الأشخاص التفكير فيها كلوحة الألوان وليس كمجموعة من قيم RGB لإنشاء قيم CMYK، ولكن يمكن الجمع بين قيم CMYK لإنشاء قيم RGB. مثال:

أرجواني + أصفر = أحمر.

سماوي + أصفر = أخضر.

سماوي + أرجواني = أزرق.

سماوي + أرجواني + أصفر = أسود.

مع معرفة ذلك، يصبح من الأسهل فهم ما تتحكم به قيم RGB الفردية وكيفية التلاعب بها للحصول على الألوان التي تبحث عنها.

أخيرًا، يمكن استخدام كل من RGB والقيم الست عشرية لعرض الألوان على صفحة الويب، ولا توجد طريقة صحيحة أو خاطئة لكتابة قيم اللون، ولكن كل واحدة لها مزاياها وعيوبها حسب المهمة التي تحاول إنجازها. وأيضًا بغض النظر عن مصطلح تسمية الألوان الذي تستخدمه، يمكنك التعامل بسهولة مع لونك عن طريق ضبط القيم التي تستخدمها.2

المراجع