استخراج لوحة ألوان من صورة

كيف تُختار الألوان

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

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

قراءة النتيجة

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

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

استخدام الألوان

• HEX، مثل #3a7d44، هي ما تتوقعه معظم أدوات التصميم والمواقع.
• RGB تعطي اللون نفسه كثلاثة أرقام من 0 إلى 255.
• HSL تصف التدرج والتشبع والإضاءة، فيسهل صنع نسخة أفتح أو أغمق يدويًا.
• OKLCH هي صيغة CSS الحديثة: الخطوات المتساوية في الإضاءة تبدو مختلفة بالقدر نفسه، فهي أفضل أساس لمجموعة من الدرجات.

انقر أي عينة لنسخها، أو استخدم نسخ الكل للقائمة كاملة، أو متغيرات CSS لكتلة تلصقها في ورقة أنماط. يمكن معالجة عدة صور في آن واحد؛ ويحتوي ملف ZIP لكل منها على شريط عينات معنون كصورة، وملف JSON، وCSS.

ألوان للنص والأزرار

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

إذا حدث خطأ

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