خلق نظام لون الويب

01 من 10

فهم برامج ألوان و ألوان الويب

اللون الأساسي - أصفر غامق. صورة J Kyrnin

هناك أربعة أنظمة الألوان الأساسية التي يمكنك استخدامها لموقع ويب. تعرض كل صفحة من هذه المقالة صورة لنظام الألوان ، وكيف يمكنك إنشاء مخطط مشابه في Photoshop.

ستستخدم جميع مخططات الألوان هذا اللون الأصفر كاللون الأساسي.

02 من 10

مخطط لون الويب أحادي اللون

مخطط لون الويب أحادي اللون. صورة J Kyrnin

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

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

03 من 10

المزيد من مخطط لون الويب أحادي اللون

مخطط لون الويب أحادي اللون. صورة J Kyrnin

يضاف مربع 20٪ أسود للحصول على المزيد من الألوان في المخطط. يمكن أن يؤدي إضافة أسود أو أبيض إلى الألوان الخاصة بك إلى إنشاء لون جديد إلى لوح الألوان الخاص بك دون العبث بهجة الصفحة.

04 من 10

نظام ألوان ويب تناظري

نظام ألوان ويب تناظري. صورة J Kyrnin

يأخذ مخطط الألوان هذا اللون الأساسي الأصفر ويضيف ويطرح 30 درجة إلى الصبغة في لوحة ألوان Photoshop.

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

05 من 10

نظام ألوان ويب أكثر تناظريًا

نظام ألوان ويب تناظري. صورة J Kyrnin

يضاف مربع 20٪ أسود للحصول على المزيد من الألوان في المخطط.

06 من 10

نظام لون الويب التكميلي

نظام لون الويب التكميلي. صورة J Kyrnin

مخططات الألوان التكميلية ، على عكس الألوان الأخرى عادة ما يكون لها لونين فقط. اللون الأساسي وهو معاكس على عجلة الألوان. يجعل Photoshop من السهل الحصول على اللون التكميلي - ما عليك سوى تحديد مساحة اللون التي تريدها وتضرب Ctrl-I. سوف فوتوشوب عكس ذلك نيابة عنك. تأكد من القيام بذلك على طبقة مكررة ، حتى لا تفقد لونك الأساسي.

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

07 من 10

المزيد من نظام ألوان الويب التكميلي

نظام لون الويب التكميلي. صورة J Kyrnin

للحصول على هذا الإصدار ، أضفت 50٪ من اللون الأبيض إلى النصف السفلي من الألوان و 30٪ أسود إلى مربع المركز. كما ترون ، فإنه يوفر لك بعض الخيارات الأخرى ولكن لا يزال نظام ألوان مكمل.

08 من 10

نظام الألوان ثلاثي الويب

نظام الألوان ثلاثي الويب. صورة J Kyrnin

تتكون أنظمة الألوان الثلاثية من 3 ألوان أكثر أو أقل تقريبًا متساوية حول عجلة الألوان. ولأن عجلة الألوان هي 360 درجة ، فقد استخدمت مرة أخرى مربع الصبغة في منتقي الألوان لإضافة وطرح 120 درجة من اللون الأساسي.

غالباً ما تُنتج مخططات الألوان الثلاثية صفحات ويب نابضة بالحياة. ولكن مثل مخططات الألوان التكميلية ، يمكن أن تؤثر على الناس بشكل مختلف. تأكد من اختبار.

يمكنك أيضًا إنشاء أنظمة ألوان رباعية أو رباعية الألوان ، حيث تكون المسافات متساوية الألوان حول عجلة الألوان.

09 من 10

المزيد من نظام الألوان ثلاثي الأبعاد

نظام الألوان ثلاثي الويب. صورة J Kyrnin

كما هو الحال مع الأمثلة الأخرى ، أضفت مربعًا أسودًا بنسبة 30٪ للألوان للحصول على الظلال الإضافية.

10 من 10

مخططات لون الويب المتنافرة

مخططات لون الويب المتنافرة. صورة J Kyrnin

الجمال في نظر الناظر ، ولكن الحقيقة المؤسفة هي أن كل الألوان لا تمضي معاً. الألوان المتضاربة هي ألوان أبعد من 30 درجة على عجلة الألوان وليست مكملة أو جزء من ثالوث.

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