🎨

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

ولّد لوحات ألوان جميلة ومتناغمة من لون أساسي واحد — مثالية لتصميم الواجهات.

لوحة ألوان جيدة ليست مجموعة عشوائية من ألوان جميلة — إنها مجموعة ألوان مختارة بقاعدة، والقاعدة هي ما يجعلها تعمل معًا. المصممون لا يختارون خمسة ألوان تصادف إعجابهم؛ يختارون لونًا أساسيًا ويشتقّون الآخرين عبر علاقات على عجلة الألوان: مكمّل، متجاور، ثلاثي. لهذا اللوحات الاحترافية تبدو متماسكة والهاوية تبدو صاخبة. تولّد هذه الأداة لوحات متناغمة من لون أساسي واحد باستخدام علاقات نظرية الألوان المُثبَتة، مانحةً إياك مجموعة منسقة لبناء تصميم عليها بدل التخمين.

كيف يعمل المولّد

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

قواعد التناغم

على عجلة ألوان 360°، من صبغتك الأساسية H: مكمّل H، H+180 → تباين عالٍ متجاور H، H+30، H−30 → هادئ، متماسك ثلاثي H، H+120، H+240 → نابض، متوازن مكمّل-مقسّم H، H+150، H+210 → تباين، أنعم رباعي H، H+90، H+180، H+270 → غني، معقّد التشبّع والإضاءة يبقيان قرب الأساس.

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

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

  • 1استخدم قاعدة 60-30-10 لتطبيق لوحة. لون مهيمن لـ60% من التصميم، وثانوي لـ30%، ولمسة لـ10% يخلق تسلسلًا بصريًا ويُبقي النتيجة من الشعور بالفوضى. اللوحة مادة خام؛ وهذه النسبة كيف يحوّل المحترفون مجموعة ألوان لواجهة متوازنة بدل غسيل مسطّح متساوٍ منها كلها.
  • 2أنظمة المكمّل عالية التباين — استخدم اللمسة باعتدال. لونان متقابلان بكامل القوة يتصارعان على الانتباه وقد يهتزّان بإزعاج. الحركة الاحترافية أساس مهيمن مع مكمّله محفوظًا للمسات صغيرة عالية الأثر كالأزرار ونداءات الفعل، حيث يعمل التباين لصالحك بدل إغراق التصميم.
  • 3افحص دائمًا التباين للنص، لا الجماليات فقط. لوحة قد تكون جميلة وتفشل إمكانية الوصول إن لم يكن للنص والخلفية تباين كافٍ — تتطلّب WCAG نسبة 4.5:1 للنص العادي. الألوان المتناغمة غالبًا متشابهة في الإضاءة، ما يُقرأ أنيقًا لكن قد يجعل النص غير مقروء. تحقّق من التباين منفصلًا عن التناغم.
  • 4اللوحات المتجاورة هي الافتراضي الآمن الهادئ. الألوان المتجاورة على العجلة تكاد تستحيل إخطاؤها — تشارك صبغة كافية لتبدو موحّدة ومنخفضة التوتر. حين يحتاج تصميم للشعور بالسكينة والتماسك والاحترافية بلا خطر، النظام المتجاور نقطة البداية الموثوقة التي نادرًا تُخيّب.
  • 5احفظ الألوان المُشبَّعة للمسات، لا المناطق الكبيرة. لون كامل التشبّع عبر سطح كبير مُرهِق للنظر ويجعل النص صعب القراءة فوقه. النهج الناضج يستخدم نسخًا مُخفَّفة التشبّع أو فاتحة من اللوحة للخلفيات والمناطق الكبيرة، حافظًا النسخ النابضة المُشبَّعة لعناصر صغيرة تحتاج جذب العين.

الأسئلة الشائعة

ما الذي يجعل الألوان تتناسب معًا؟

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

ما الفرق بين اللوحات المكمّلة والمتجاورة؟

المكمّل يستخدم ألوانًا متقابلة على العجلة (180° متباعدة)، مُنتجًا تباينًا عاليًا وطاقة — جيد لجذب الانتباه لكن حاد إن أُفرِط. المتجاور يستخدم ألوانًا مجاورة (ضمن نحو 30°)، مُنتجًا شعورًا هادئًا متماسكًا منخفض التوتر — جيد للتصاميم الساكنة الموحّدة. أنظمة المكمّل تحتاج تباينها مُستخدَمًا بحذر كلمسات؛ والمتجاورة أكثر تسامحًا وصعبة الإخطاء، ما يجعلها افتراضًا آمنًا شائعًا.

كم لونًا يجب أن يكون في لوحة؟

عادةً ثلاثة لخمسة لتصميم متماسك: لون مهيمن، ولون أو اثنان ثانويان، ولمسة. أكثر من ذلك يصير صعب التطبيق باتساق ويميل للفوضى. قاعدة 60-30-10 الكلاسيكية — 60% مهيمن، 30% ثانوي، 10% لمسة — تعمل أفضل بلوحة صغيرة. أسهل بناء تصميم قوي من بضعة ألوان مُختارة جيدًا من ترويض مجموعة كبيرة لتبدو منسقة.

كيف أضمن أن ألواني قابلة للوصول؟

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

هل أستطيع بناء تصميم كامل من لون أساسي واحد؟

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