بناء تصميم حول صورة منتج، أو لقطة علامة تجارية، أو صورة تعبّر عن جو معيّن، يبدأ بألوانها. أفلِت الصورة واحصل على لوحتها السائدة، مرتّبة من الفاتح إلى الداكن، كل عيّنة على بُعد نقرة واحدة من كود hex منسوخ.
يستخدم الاستخراج تكميم القطع الوسيط على البكسلات الفعلية — العائلة نفسها من الخوارزميات التي تستخدمها محرّرات الصور — فتعكس اللوحة توزيع الألوان الحقيقي، لا مجرد متوسط ضبابي.
طريقة الاستخدام
- أضف صورةأي صورة أو شعار أو عمل فني.
- اضبط حجم اللوحةمن 3 إلى 12 لونًا — راقب تحدّث العيّنات حيًا.
- انسخ الأكوادانقر أي عيّنة للحصول على كود hex الخاص بها، أو انسخ اللوحة كاملة دفعة واحدة.
استخرج لوحة ألوان حقيقية من أي صورة
يقرأ هذا المستخرِج البكسلات الفعلية لصورتك ويعثر على ألوانها السائدة باستخدام تقطيع الوسيط (median-cut)، النهج نفسه وراء تقليل الألوان الجيد. هذا يعني أن اللوحة تعكس ما في الصورة حقًّا، لا تخمينًا أو متوسطًا مُرشَّحًا. حمّل صورة فتحصل على مجموعة عيّنات hex مأخوذة مباشرةً من المصدر.
تختار كم لونًا تستخرج، من 3 إلى 12. العيّنات الأقل تمنحك لوحة محكمة بأسلوب العلامات التجارية؛ والأكثر تمنحك نظام ألوان أوفى لأعمال التصميم. وتُزال العيّنات المتطابقة، فلا تحصل أبدًا على قيمة hex نفسها مرتين.
انسخ رموز hex بنقرة واحدة
تعرض كل عيّنة قيمة hex الخاصة بها، والنقر على عيّنة ينسخ ذلك الرمز إلى حافظتك. وحين تريد المجموعة كلها، ينسخ زر واحد اللوحة كاملةً دفعة واحدة، جاهزة للصق في CSS أو أداة تصميم أو دليل نمط. وتُرتَّب اللوحة من الفاتح إلى الداكن لتُقرأ كتدرّج مرتب لا خليطًا مشوّشًا.
ولأن كل شيء يجري في المتصفح على صورتك، يمكنك استخراج لوحة ألوان من صورة أو لقطة شاشة أو شعار دون رفع أي شيء.
فيمَ يستخدمها الناس
بناء لوحة علامة تجارية — استخرج الألوان السائدة من شعار أو صورة رئيسية لترسي نظام ألوان متسقًا.
مطابقة تصميم مع صورة — استخرج نظام الألوان من لقطة منتج ليبدو تخطيطك جزءًا من الصورة نفسها.
تنسيق ألوان الويب والواجهات — احصل على رموز hex من صورة مزاج لتغذية متغيّرات CSS لألوان التمييز والخلفية في موقع.
انتقاء الألوان من عمل فني — استعِن بالألوان الحقيقية في رسم توضيحي أو لوحة لإعادة استخدامها في عملك.
سمات العروض والشرائح — استخرج بضعة ألوان سائدة من صورة غلاف لتنسيق سمة العرض كله.
لوحات إلهام الأزياء والديكور — احصل على اللوحة من صورة إلهام لمطابقة الأقمشة أو الطلاء أو الإكسسوارات.
مجموعات ألوان تصوير البيانات — استخرج مجموعة ألوان متمايزة من صورة مرجعية لبناء لوحة مخطط.
بحث سريع عن hex — أفلِت لقطة شاشة وانقر العيّنة التي تحتاجها لنسخ رمز hex الدقيق لها.
استخرج الألوان مباشرة من صورة
لديك صورة، أو لقطة شاشة، أو قطعة تغليف، أو لقطة من فيلم — وتريد الألوان فيها كرموز HEX. ربما لمطابقة موقع إلكتروني بصورة علامة تجارية، أو لبناء سمة شرائح حول لقطة منتج، أو لمعرفة ما هو ذلك التدرّج في ملصق فعلًا. قراءة الألوان بالعين غير موثوقة؛ فلون يبدو كحليًّا على شاشتك قد يكون #1B2A4A أو #14233F، والتخمين يكلّفك وقتًا ونتيجة منحرفة قليلًا.
الغريزة أن تفتح موقع لوحة ألوان وتعيد بناء الألوان من الصفر، لكن ذلك يقلب المهمة. أدوات مثل Coolors وAdobe Color ممتازة في توليد اللوحات — تُثبِّت عيّنة، وتضغط المسافة، وتستكشف التناغمات — لكن حين يكون اللون الذي تريده موجودًا أصلًا داخل صورة، فالتوليد من العدم هو الطريق الطويل. تنتهي بأخذ عيّنة اللون من الصورة في تطبيق ولصق رموز HEX في آخر.
تفعل Palette الأمر المباشر. أفلِت صورة فتستخرج مجموعة من الألوان المهيمنة عبر تقليل median-cut — العائلة ذاتها من الخوارزميات المستخدَمة لتقليص صورة إلى ألوانها الأكثر تمثيلًا — ثم تعرضها كعيّنات مرتّبة من الفاتح للداكن. انقر أي عيّنة لنسخ رمز HEX خاصّتها، أو انسخ المجموعة كاملة دفعة واحدة. يأخذك شريط تمرير من ثلاثة ألوان حتى اثني عشر، فتسحب زوج لمسات متراصًّا أو سمة كاملة. تعمل كليًا في متصفحك: تُقرأ الصورة محليًا ولا تُرفع أبدًا، وهو ما يهمّ حين يكون المصدر تصميمًا لم يُطلق، أو صورة عميل، أو أي شيء تفضّل ألا ترسله لخادم لمجرد أخذ عيّنة لون.
ما الذي يميّزها
- تستخرج، لا تولّد. تقرأ الألوان الموجودة أصلًا في صورتك بدل أن تطلب منك بناء لوحة من الصفر.
- تقليل median-cut. خوارزمية حقيقية تنتقي ألوانًا مهيمنة تمثيلية بدل أخذ عيّنة من بضعة بكسلات عشوائية.
- عدد قابل للضبط. حرّك من 3 إلى 12 لونًا — زوج لمسات أو سمة كاملة — وتعيد الاستخراج حيًّا.
- انقر للنسخ. انقر أي عيّنة لـ HEX خاصّتها، أو انسخ كل الرموز بنقرة واحدة، جاهزة للصق في CSS أو أداة تصميم أو سمة شرائح.
- مرتّبة للاستخدام. العيّنات مرتّبة بالسطوع فتُقرأ اللوحة طبيعيًا.
- خاصة ودون اتصال. لا تغادر الصورة جهازك أبدًا، وتواصل العمل بعد الزيارة الأولى بلا اتصال.
- مجانية، بلا حساب، بلا علامة مائية.
IMG.DIY مقابل أدوات الألوان الأخرى
Coolors وAdobe Color أداتان قويتان بمركز ثقل مختلف. الانقسام الصادق هو توليد لوحة مقابل استخراج ألوان من صورة.
| الجانب | Coolors | Adobe Color | IMG.DIY |
|---|---|---|---|
| القوة الأساسية | توليد اللوحات واستكشافها | تناغمات الألوان، تكامل Adobe | استخراج الألوان من صورة |
| الاستخراج من صورة | نعم (رفع / محدود في المجاني) | نعم | نعم، الوظيفة الأساسية |
| يرفع الصورة إلى خادم | عادةً نعم | نعم | لا، تبقى في المتصفح |
| يتطلّب حسابًا | للحفظ / بعض الميزات | حساب Adobe للاستخدام الكامل | لا |
| عدد ألوان قابل للضبط | نعم | مجموعات ثابتة | 3–12، حيًّا |
| نسخ HEX | نعم | نعم | انقر عيّنة، أو انسخ الكل |
| دون اتصال | لا | لا | نعم، بعد الزيارة الأولى |
| الكلفة | فئة مجانية + مدفوع | مجاني بحساب Adobe | مجاني، بلا حدود |
إن كانت مهمتك تصميم لوحة من العدم — استكشاف التناغمات، والتثبيت والخلط، وحفظ المجموعات — فإن Coolors وAdobe Color بيت أفضل، وAdobe Color يصعب التغلّب عليه إن كنت تعيش داخل Creative Cloud. حيث يصبحان أثقل هو الحالة التي بُنيت هذه الأداة لها بالضبط: لديك صورة أصلًا وتريد فقط ألوانها، بخصوصية، دون رفع أو تسجيل دخول. تسحب Palette رموز HEX في إفلاتة واحدة، وتتيح لك ضبط العدد، وتنسخها لك — ثم تبتعد عن الطريق.
لماذا IMG.DIY
ألوان سائدة حقيقية
قطع وسيط على البكسلات الفعلية، لا متوسط ضبابي.
نسخ بنقرة واحدة
كل عيّنة تنسخ كود hex الخاص بها فورًا.
3–12 لونًا
حدّد بدقة مدى تفصيل اللوحة.
خاص
الصورة لا تغادر جهازك أبدًا.