تولزاتيترى صورة مبهرة — غروب، واجهة متجر، لوحة فنية — وتتمنى لو تستطيع «نسخ» إحساسها اللوني إلى تصميمك. الخبر الجيد أن هذا ممكن حرفياً: أي صورة تحمل باليتها الخاصة في داخلها، واستخراجها ليس عملاً يدوياً بالتخمين بل عملية تحليل فعلية للبكسلات. المشكلة أن معظم الناس يتوقفون عند سحب لون واحد بأداة القطارة، بينما الهوية اللونية الحقيقية تحتاج نظاماً من خمسة إلى سبعة ألوان بأدوار مختلفة. هذا الدليل يشرح كيف يعمل الاستخراج وكيف تحوّله إلى باليت قابلة للاستخدام فعلياً.
ماذا يعني «استخراج الألوان» فعلياً؟
الصورة الرقمية ملايين البكسلات بألوان شبه فريدة، ولا أحد يحتاج مليون لون. الخوارزميات تجمّع البكسلات المتشابهة في عناقيد لونية ثم تختار اللون الممثل لكل عنقود — النتيجة الألوان السائدة التي تبني الإحساس العام للصورة. اللون الأكثر حضوراً عددياً ليس بالضرورة الأهم: لون صغير مشبع (زر أحمر في صورة رمادية) قد يكون أقوى بصرياً من الخلفية التي تملأ 70% من الكادر. لهذا الباليت الجيدة لا تعرض الألوان الخام فقط بل ترتّبها بأدوار: لون أساسي للهوية، ثانوي داعم، لون تمييز للأزرار والتنبيهات، ولونا خلفية ونص.
HEX أم RGB أم HSL — متى تستخدم أيّاً؟
الثلاثة طرق مختلفة لوصف اللون نفسه، ليس ثلاثة ألوان مختلفة. HEX (مثل #3B82F6) الأكثر شيوعاً في CSS والتصميم — مختصر ويُنسخ بسهولة. RGB يصف اللون بقنواته الثلاث ويناسب برامج التصميم والفيديو. أما HSL (تدرج/تشبع/سطوع) فالأنسب عندما تبني تنويعات على لون واحد: لون بـH 220° يمكن توليد نسخة فاتحة منه بزيادة L فقط، وهو ما تفعله أنظمة التصميم لتوليد الدرجات العشر لكل لون أساسي. عملياً: استخرج بالـHEX للعرض السريع، وفكّر بالـHSL عندما تعدّل أو تشتق تنويعات. أداة مستخرج الألوان ومولد الباليت تعرض اللون نفسه بالصيغ الثلاث معاً وتتيح التحويل بينها فوراً.
بناء باليت متوازنة بدل جمع ألوان عشوائية
خطأ البداية الشائع هو استخراج خمسة ألوان كلها مشبعة وزاهية — النتيجة تصميم صاخب بلا تسلسل. الباليت العملية تحتاج تنوعاً في السطوع والتشبع لا الألوان فقط: ألواناً داكنة للنصوص والخلفيات الداكنة، لوناً أو اثنين متوسطي التشبع للعناصر الرئيسية، ولون تمييز واحد عالي التشبع يُستخدم بندرة للأزرار المهمة. قاعدة 60-30-10 عملية هنا: 60% للون المحايد الخلفي، 30% للثانوي، و10% فقط للون التمييز. عندما تستخرج باليت من صورة لا تأخذ أول خمسة ألوان تظهر — انتقِ منها التشكيلة التي تغطي هذه الأدوار.
من الباليت إلى الكود: التصدير الجاهز
الباليت التي تبقى في صورة PNG مرجعية تموت في مجلد التنزيلات. الصيغة العملية هي تصديرها بصيغة يستعملها مشروعك مباشرة: متغيرات CSS (--primary: #3B82F6;) تلصقها في ملفك، أو JSON لأنظمة التصميم وأدوات بناء الواجهات. أداة مستخرج الألوان في تولزاتي تصدّر الباليت بالصيغتين معاً بعد استخراجها من صورتك — والأهم أن كل شيء يحدث في متصفحك: صور منتجاتك أو أعمال عملائك لا تُرفع لأي خادم، فتستطيع استخراج هويات مشاريع سرية قبل إعلانها بأمان كامل.
أخطاء تفسد باليتك المستخرجة
أولها الاستخراج من صورة مضغوطة بجودة رديئة — الضغط يخلط البكسلات فينتج ألواناً مموّهة لا تعكس الصورة الحقيقية. ثانيها تجاهل الـcontrast: لون تمييز جميل لكنه غير مقروء على الخلفية يبقى غير قابل للاستخدام مهما أعجبك — افحص نصاً فعلياً فوقه قبل اعتماده. ثالثها نسخ باليت صورة تمتلك إضاءة درامية (غروب برتقالي مثلاً) لتطبيق على واجهة قراءة يومية — الإحساس اللوني للصور الفنية لا يتحول دائماً لمنتج عملي. اختر صوراً قريبة من سياق استخدامك أصلاً.
الخلاصة: الهوية اللونية الجيدة نظام بأدوار لا مجموعة ألوان جميلة. استخرج من صورة قريبة من سياقك، رتّب الألوان بوظائفها لا بجاذبيتها، وتأكد أن الباليت قابلة للتصدير بصيغة يفهمها مشروعك من اليوم الأول.