آلية عمل أداة اختيار الألوان من الصور
تتيح هذه الأداة تحديد أي بكسل بدقة من صورة تختارها من جهازك لاستخراج قيم الألوان الخاصة به. عند تحميل الصورة، تعرض الأداة فوراً قيم الألوان وإحداثيات البكسل المركزي لها كإجراء افتراضي. ولتسهيل عملية التحديد الدقيق للبكسلات، توفر الأداة عدسة مكبرة مدمجة تعرض المنطقة المحيطة بمؤشر الفأرة بوضوح.
بمجرد تحريك المؤشر فوق الصورة، يتم أخذ عينات الألوان بكسل تلو الآخر وعرض قيمها بصيغ HEX وRGB وHSL. يؤدي النقر على الصورة إلى حفظ اللون المحدد حالياً في قائمة الألوان المحفوظة. كما تدعم الأداة التحكم الكامل عبر لوحة المفاتيح؛ حيث يمكنك تحريك علامة التقاطع فوق الصورة باستخدام مفاتيح الأسهم لأخذ العينات، والضغط على مفتاح Shift مع الأسهم لتحريك العلامة بمقدار 10 بكسلات دفعة واحدة، ثم الضغط على مفتاحي Enter أو Space لحفظ اللون النشط.
تتسع قائمة الألوان المحفوظة لتخزين ما يصل إلى 12 لوناً مختلفاً. وتُعامل الألوان ذات قيم RGB المتطابقة ولكن بقيم شفافية (ألفا) مختلفة كإدخالات منفصلة في القائمة. يمكنك نسخ أي قيمة لونية (HEX أو RGB أو HSL) مباشرة إلى الحافظة بمجرد النقر عليها.
صيغ الملفات المدعومة والقيود التقنية
تتعامل الأداة مع ملف صورة واحد في كل عملية فحص، وتدعم مجموعة محددة من صيغ الصور الشائعة والحديثة:
- الصيغ المدعومة: PNG، وJPG، وWebP، وGIF، وAVIF، وHEIC.
- أنواع MIME المقبولة:
image/jpeg، وimage/png، وimage/webp، وimage/gif، وimage/avif، وimage/heic، وimage/heif.
إذا حاولت إسقاط ملف غير مدعوم، ستظهر رسالة الخطأ التالية: "نوع الملف هذا غير مدعوم. يرجى تجربة صورة بصيغة PNG أو JPG أو WebP أو GIF أو AVIF أو HEIC." وفي حال تعذر فتح الملف بسبب تلف البيانات أو عدم توافق الترميز، تظهر رسالة: "تعذر فتح هذه الصورة. قد تكون تالفة أو بصيغة غير مدعومة."
تخضع الصور الكبيرة لعملية تحجيم تلقائية؛ حيث يتم تصغير أي صورة يتجاوز طول ضلعها الأكبر 4096 بكسل للحفاظ على أداء المتصفح. وعند الرغبة في تصفير الأداة، يؤدي النقر على زر "البدء من جديد" إلى مسح الصورة تماماً، وإفراغ سجل الألوان المحفوظة، وإعادة الأداة إلى حالتها الأولية.
فهم نماذج الألوان وتأثيرات الضغط والشفافية
تعرض الأداة قيم البكسل الدقيقة المخزنة في ملف الصورة دون تعديل، وتوفرها بثلاثة نماذج أساسية تستخدم في التصميم وتطوير الويب:
- HEX: الترميز الست عشري المستخدم بكثرة في تنسيق صفحات الويب (CSS).
- RGB: قيم الألوان الأساسية الثلاثة (الأحمر، الأخضر، الأزرق).
- HSL: قيم تصف اللون من خلال الصبغة (Hue)، والتشبع (Saturation)، والإضاءة (Lightness).
عند تحليل الصور، يجب مراعاة أن قيم البكسلات قد تختلف عن الألوان الأصلية التي يتوقعها المستخدم في حالتين:
- الضغط وتنعيم الحواف: في صور JPEG أو لقطات الشاشة، تؤدي خوارزميات الضغط وتنعيم الحواف (Anti-aliasing) إلى تعديل طفيف في قيم الألوان للبكسلات المتجاورة، مما ينتج عنه قيم مختلفة قليلاً عن اللون الأصلي المصمم.
- الشفافية (قناة ألفا): يتم قراءة البكسل شبه الشفاف بشكل مستقل تماماً دون دمج أو احتساب ألوان الخلفية التي تقع خلفه في المتصفح. وفي هذه الحالة، تعرض الأداة تنبيهاً يوضح نسبة الشفافية بالصيغة: "الشفافية (ألفا)
{n}% — هذا البكسل شفاف جزئيًا."
خصوصية البيانات ومعالجتها
تتم معالجة الصورة بالكامل محلياً داخل متصفح الويب الخاص بك. يتم قراءة الصورة مباشرة من جهازك ولا تغادر متصفحك أبدًا. لا يتم تحميل أي شيء إلى BroBroGo، مما يضمن بقاء بياناتك وملفاتك داخل بيئة عملك المحلية دون أي تدخل من خوادم خارجية.
حالات الاستخدام المهنية
تخدم هذه الأداة مجموعة من التخصصات الرقمية التي تتطلب دقة عالية في التعامل مع الألوان:
- مطوروا الويب: للحصول على قيم الألوان الدقيقة بصيغ HEX أو RGB أو HSL لدمجها مباشرة في ملفات تنسيق الصفحات CSS.
- مصممو واجهات المستخدم (UI): لاستخراج عينات الألوان بدقة من لقطات الشاشة أو التصاميم المرجعية وتطبيقها في برامج التصميم.
- صناع المحتوى: لتحديد درجات الألوان الخاصة بالعلامات التجارية وتنسيق الصور والمواد البصرية بدقة متناهية.
الأسئلة الشائعة
كيف يمكنني اختيار لون من الصورة؟
مرر المؤشر فوق الصورة لتعرض لك اللوحة اللون الواقع تحتها مباشرة، مع مكبر يقرب لك التفاصيل لتحديد البكسل بدقة متناهية. انقر لحفظ اللون في قائمتك. يمكنك أيضًا تحديد الصورة وتحريك علامة التقاطع باستخدام مفاتيح الأسهم، ثم الضغط على Enter.
ما هي صيغ الألوان التي أحصل عليها؟
يتم عرض كل بكسل تحدده بصيغ HEX وRGB وHSL في نفس الوقت. انقر فوق أي قيمة لنسخها ولصقها مباشرة في ملفات CSS أو أدوات التصميم.
لماذا لا يتطابق اللون المختار دائمًا مع ما كنت أتوقعه؟
تحصل على قيمة البكسل الدقيقة المخزنة في الصورة. إذا كانت الصورة بصيغة JPEG أو لقطة شاشة، فقد تؤدي عمليات الضغط وتنعيم الحواف إلى إزاحة طفيفة في ألوان البكسلات المجاورة، كما يتم قراءة البكسل شبه الشفاف بمفرده دون العناصر التي تقع خلفه.
ماذا أفعل إذا رفض المتصفح نسخ قيمة اللون؟
في حال قام المتصفح بحظر الوصول إلى الحافظة لأسباب تتعلق بالأمان، ستعرض الأداة رسالة التنبيه التالية: "تعذر النسخ — منع متصفحك الوصول إلى الحافظة." وفي هذه الحالة يمكنك تحديد النص يدوياً ونسخه.