استخدام Paletton للمساعدة في اختيار لوحة ألوان موقع WordPress الخاص بك

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

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

لماذا من المهم اختيار الألوان المناسبة لموقعك على الويب

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

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

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

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

تبدأ كل لوحات الألوان باللون الأساسي

لكل لوحة ألوان تنشئها على Paletton ، ستحتاج إلى لون أساسي للعمل به. لكن كيف تعرف اللون الأساسي الذي يجب استخدامه؟

ألق نظرة على المحتوى الذي قدمه لك العميل وعلامته التجارية وأي صور تم توفيرها لك.

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

عند إنشاء لوحة على Paletton ، يمكنك إما اختيار لون أساسي بصريًا أو رمز سداسي عشري في علامة تبويب اللون الأساسي السداسي.

التعرف على واجهة مستخدم تطبيق Paletton

حان الوقت الآن لبدء إنشاء اللوحات. دعنا نلقي نظرة على كيفية إعداده بالكامل. يحتوي التطبيق على قسمين رئيسيين ؛ يدور الجانب الأيسر حول اختيار الألوان والجانب الأيمن يدور حول عرض المعاينات.

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

الجانب الأيسر - محددات اللون

أول شيء تلاحظه عند دخولك إلى تطبيق Paletton هو عجلة الألوان. يكون للعرض الافتراضي اللون الأساسي كالأحمر المحايد في لوحة أحادية اللون (لون واحد).

سترى مجموعة من 5 نقاط في خط داخل دائرة الألوان. النقطة الموجودة في المركز هي اللون الأساسي ، وتضيف نقطتان سطوعًا وإشباعًا بينما تضيف النقطتان الأخريان تباينًا وتشبعًا.

تركيبات الألوان

يوجد فوق دائرة الألوان خمسة أزرار مركبة. الخيارات من اليسار إلى اليمين:

• أحادي اللون - لون واحد + مكمل اختياري
• متجاورة - 3 ألوان + تكميلية اختيارية
• ثلاثي - 3 ألوان + مكمل اختياري
• تتراد - 4 ألوان
• أسلوب مجاني - 4 ألوان

اللون الأساسي

لتغيير اللون الأساسي ، يمكنك القيام بأي مما يلي:

1. اسحب نقطة اللون الرئيسية إلى أي مكان في الدائرة الخارجية.
2. اسحب النقطة الوسطى داخل الدائرة لاختيار تدرج مختلف للون الرئيسي المختار في الدائرة الخارجية
3. أدخل رمز سداسي عشري في علامة التبويب اليسرى السفلية.
4. لتحويل لون ثانوي إلى اللون الأساسي ، سيتعين عليك القيام بذلك على جانب المعاينة من الشاشة. المزيد عن ذلك لاحقًا.

عندما تسحب نقطة اللون الأساسية داخل الدائرة ، تتحرك جميع النقاط الأخرى معها لتظهر متغيرات الصبغة.

يمكنك أيضًا تحديد ألوان فردية عن طريق النقر فوق shift قبل السحب.

الكون المثالى

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

• مسحة
• التشبع
• سطوع
• التباين

ما عليك سوى النقر فوق الأزرار لإضافة أو تقليل كل تأثير بمقدار 1 أو 5 أو 10 درجات.

الإعدادات المسبقة وفقًا للون الأساسي

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

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

الجانب الأيمن - معاينة لوحة

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

في الصورة أدناه ، سترى كيف يعمل منتقي الألوان والمعاينة معًا.

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

تبديل اللون الأساسي

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

استخدام ميزة محاكاة رؤية Paletton

واحدة من أعظم ميزات Paletton هي القدرة على تقييم كيف ستبدو ألوانك في حالات غير متوقعة. تسمى الميزة "محاكاة الرؤية" وستجدها أسفل مربع المعاينة. هذه هي المحاكاة المتاحة:

• محاكاة أعمى الألوان
• غير مشبع
• محاكاة جاما
• ألوان الويب (لوحة ألوان قديمة 216 لونًا)

هذه أداة رائعة إذا كنت تقوم بإنشاء لوحة ألوان لموقع ويب. يمكنك معرفة ما إذا كانت لوحتك ستبدو جيدة في كل تلك الحالات. الأكثر فائدة هو محاكاة عمى الألوان. من الجيد التأكد من تمييز كل الألوان عن بعضها البعض!

رؤية أمثلة حية من لوحة الألوان الخاصة بك

هناك أداة عملية أخرى في Paletton وهي علامة التبويب التي توضح لك كيف ستبدو اللوحة على موقع ويب نموذجي وأنماط تصميم أخرى. ستجد هذه المحاكاة في علامة التبويب "أمثلة ...". الخيار الأول هو تخطيط الصفحة وله بعض الخيارات:

• صفحة بيضاء
• صفحة مظلمة
• تصميم إيجابي
• التصميم السلبي

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

علاوة على ذلك ، في هذه المرحلة ، يمكنك ترتيب لوحة الألوان بشكل عشوائي بعدة طرق مختلفة:

• ألوان متشابهة ، على عكس الأسلوب
• على عكس
• مشابه
• على عكس الألوان ، نمط مماثل

تأكد من الحصول على نسخة من لوحتك قبل أن تختارها بشكل عشوائي! ليس هناك عودة.

تصدير ونسخ لوحة الألوان

الآن بعد أن قمت بتعديل ومعاينة لوحة الألوان الخاصة بك ، فقد حان الوقت لتصديرها من Paletton وتجهيزها لموقع الويب الخاص بك.

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

انسخ لوح الألوان الخاص بك بأي من هذه الطرق الأخرى:

• انسخ الرموز السداسية للألوان الفردية عن طريق التمرير لرؤيتها والنقر لفتح نافذة المعلومات.
• انقر فوق "جداول / تصدير" لرؤية اللوحات بتنسيقات مختلفة.
• داخل علامة التبويب "الجداول / التصدير" ، قم بالتصدير بأي من التنسيقات التالية:
  • قوائم الألوان
    • لغة البرمجة
    • أقل
    • CSS
    • ساس
    • XML
    • نص
  • مغير الألوان
    • صورة PNG
    • ACO (فوتوشوب)
    • GPL (Gimp)
• يمكنك أيضًا عرض مجموعات الألوان في اللوحة المختارة.

إضافة الألوان إلى موقع الويب الخاص بك على WordPress

حان الوقت الآن لإضافة الألوان فعليًا إلى موقعك!

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

لإضافة ألوان إلى سمة Divi الخاصة بك ، انتقل إلى "خيارات السمة" الخاصة بك ، وأدخل كل لون برمزه السداسي العشري المقابل.

هذا لون التفاف!

لقد انتهينا من مراجعة الخطوات لإنشاء لوحة ألوان باستخدام Paletton. تتشابه الميزات الأساسية للتطبيق مع تطبيقات لوحة الألوان الأخرى ، ولكن ما يميزه عن البقية هو القدرة على رؤية الألوان في الأمثلة الحية لكل من تصميم الويب والتصميمات الفنية الأخرى. إنه لأمر مؤسف أن التطبيق لم يتم تحديثه منذ أكثر من 6 سنوات. لحسن الحظ ، يبدو أنه يظل على قيد الحياة من خلال إعلانات Google هذه !.

ما هو تطبيق مولد لوحة الألوان المفضل لديك؟ هل جربت Paletton حتى الآن؟ اسمحوا لنا أن نعرف في التعليقات!

صورة مميزة عبر DaGaAl / shutterstock.com