ما الذي يميز هذه الصفحة؟
هذه الصفحة مصممة خصيصاً لمن يحتاج قيمة اللون السداسية العشرية (HEX) من أي نقطة في صورة. على عكس الصفحات الشقيقة التي تُخرج الألوان بصيغتي RGB (الأحمر-الأخضر-الأزرق) أو HSL (الدرجة-التشبع-الإضاءة)، تُعطي هذه الصفحة الرمز السداسي العشري كالنتيجة الأساسية. الرمز السداسي العشري هو الصيغة المدمجة القياسية المستخدمة في CSS وأدوات التصميم، مثل #1E90FF. لا يحمل هذا الرمز قناة شفافية في صورته المكونة من ستة أرقام؛ لذلك تُبلغ الأداة عن أي شفافية بشكل منفصل كنسبة مئوية (على سبيل المثال: "الشفافية 30% – هذه البيكسل شفافة جزئياً").
بما أن الصيغة السداسية العشرية مضغوطة ومتوافقة مع الويب، فإن هذه الصفحة هي الخيار الأمثل عندما تحتاج قيمة لون يمكن إدراجها مباشرة في خصائص CSS مثل color أو background-color دون الحاجة إلى أقواس أو بناء جملة إضافية.
آلية عمل الأداة
المدخلات والمخرجات الأساسية
المدخلات: تدعم الأداة ملفات الصور بالتنسيقات التالية: PNG و JPG و WebP و GIF و AVIF و HEIC. أنواع MIME المقبولة هي: image/jpeg و image/png و image/webp و image/gif و image/avif و image/heic و image/heif. عند تحميل صورة تتجاوز أطول أبعادها 4096 بيكسل، يتم تصغيرها تلقائياً مع الحفاظ على نسبتها.
المخرجات: بمجرد تحميل الصورة، تظهر الرسالة "الصورة جاهزة – حرّك المؤشر فوقها لأخذ عينة، انقر لحفظ لون". يتم عرض أبعاد الصورة (العرض × الارتفاع) فوراً، إلى جانب إحداثيات البيكسل (س، ص) للبيكسل المركزي – وهو أول لون يتم عرضه تلقائياً. عند تحريك المؤشر فوق الصورة، تتغير القيم لكل بيكسل يمر عليه المؤشر. يُعرض رمز HEX المكون من ستة أرقام (مثل #1E90FF) كأول قيمة، ثم قيم RGB (أحمر، أخضر، أزرق) وقيم HSL (درجة، تشبع، إضاءة). إذا كان البيكسل شفافاً جزئياً، يُضاف السطر: "الشفافية ‹ن›% – هذه البيكسل شفافة جزئياً."
عند النقر على الصورة، يُحفظ اللون الحالي ضمن تاريخ "اختياراتك" (حتى 12 عنصراً)، وتظهر رسالة "تم حفظ ‹الرمز السداسي› في اختياراتك." يتيح النقر على أي من القيم المعروضة (HEX، RGB، HSL) نسخها تلقائياً إلى الحافظة. إذا حظر المتصفح الوصول إلى الحافظة، تظهر رسالة "تعذر النسخ – حظر المتصفح الوصول إلى الحافظة."
التكبير (المُكبر)
تتضمن الأداة عرضاً مكبراً للنقطة التي يمر عليها المؤشر، مما يساعد في تحديد البيكسل الدقيق، خاصة في المناطق المضادة للتحبب (anti-aliased) أو المضغوطة حيث تختلف قيم البيكسلات المتجاورة. يعمل هذا التكبير جنباً إلى جنب مع التنقل بلوحة المفاتيح لضمان الدقة.
صيغة HEX: لماذا هي الخيار الأول
تمثل الصيغة السداسية العشرية الألوان باستخدام ستة أرقام ستة عشرية: رقمين لكل قناة من الأحمر والأخضر والأزرق. على سبيل المثال، #FF5733 يعني أن قنوات RGB هي (255, 87, 51). يوفر هذا النظام تمثيلاً مضغوطاً ومحدداً تماماً، دون غموض مهما كان جهاز العرض. بالمقارنة مع RGB (مثل rgb(255, 87, 51)) أو HSL (مثل hsl(11, 100%, 60%))، فإن HEX يقلل من عدد الأحرف المطلوبة في كود CSS ويسهل قراءته عند التعامل مع العديد من الألوان.
تختلف هذه الصفحة عن صفحتي RGB وHSL في أنها لا تُخرج أي بناء جملة وظيفي (functional notation) بل الرمز المباشر. هذا يجعلها مناسبة للمطورين الذين يحتاجون فقط إلى النص السداسي لاستخدامه في أدوات التصميم مثل Figma أو Adobe XD، حيث يكون إدراج الرمز دون أقواس أو فواصل هو الأسهل.
التعامل مع الشفافية (قناة ألفا)
لا تدعم الصيغة السداسية العشرية المكونة من ستة أرقام قناة ألفا. لذلك، عند وجود شفافية في البيكسل، تعرض الأداة النسبة المئوية للشفافية بشكل منفصل. مثلاً، إذا كان البيكسل يحتوي على قيمة ألفا 128 (أي 50% شفاف)، ستظهر الرسالة: "الشفافية 50% – هذه البيكسل شفافة جزئياً." يتم قراءة قيمة البيكسل كما هي في الصورة، دون النظر إلى أي خلفية قد تكون خلفها. هذا يعني أن اللون المعروض هو لون البيكسل الأصلي – سواء كان شبه شفاف أو معتم – وليس نتيجة دمج مع خلفية.
يمكن حفظ الألوان التي لها نفس قيم RGB ولكن بقيم ألفا مختلفة كإدخالات منفصلة في تاريخ الاختيارات. هذا مفيد عند التعامل مع صور PNG التي تحتوي على طبقات شفافية متعددة.
القيود والحالات الطرفية
دقة البيكسل وتأثير الضغط
تعرض الأداة القيمة الدقيقة للبيكسل كما هي مخزنة في الصورة. ولكن، إذا كانت الصورة من نوع JPEG أو لقطة شاشة، فقد يكون الضغط والاختناق (التشويش) قد غيّرا قيم البيكسل الأصلية. لذلك، في المناطق التي تبدو موحدة اللون، قد تختلف البيكسلات المجاورة قليلاً، مما يجعل اختيار البيكسل الدقيق أمراً بالغ الأهمية. يعمل التكبير على تخفيف هذه المشكلة.
أنواع الملفات غير المدعومة
إذا تم إفلات ملف غير مدعوم، تظهر الرسالة: "نوع الملف هذا غير مدعوم. جرب صورة بصيغة PNG أو JPG أو WebP أو GIF أو AVIF أو HEIC." إذا تعذر فتح الصورة لأي سبب (تلف الملف، تنسيق غير معترف به)، تظهر الرسالة: "تعذر فتح الصورة. قد تكون تالفة أو بصيغة غير مدعومة."
فشل الحافظة
عند النقر على أي قيمة لون لنسخها، إذا منع المتصفح الوصول إلى الحافظة – وهو إجراء أمني شائع – تظهر الرسالة المذكورة سابقاً. لا يوجد حل بديل في هذه الحالة سوى استخدام نسخ يدوي.
تصغير الصور الكبيرة
الصور التي يتجاوز أطول أبعادها 4096 بيكسل يتم تصغيرها تلقائياً مع الاحتفاظ بنسبة العرض إلى الارتفاع. هذا يضمن أداءً سلساً دون فقدان كبير للدقة، ولكن يجب الانتباه إلى أن التصغير قد يغير قيم الألوان بشكل طفيف بسبب إعادة العينة (resampling).
التنقل بلوحة المفاتيح لتحقيق الدقة
توفر الأداة دعماً كاملاً للوحة المفاتيح، وهو أمر حيوي للمستخدمين الذين لا يستطيعون استخدام الماوس أو يريدون دقة بدون اعتماد على المؤشر. يمكن تحريك علامة التقاطع (crosshair) فوق الصورة باستخدام مفاتيح الأسهم. يؤدي الضغط على Shift مع أحد مفاتيح الأسهم إلى تحريك العلامة بعشر بيكسلات بدلاً من بيكسل واحد. لحفظ اللون الحالي، يمكن الضغط على Enter أو Space. هذا يجعل عملية أخذ العينات دقيقة وقابلة للتكرار تماماً.
بالإضافة إلى ذلك، زر "بدء من جديد" يعيد الأداة إلى حالتها الأولية: يمسح الصورة، يفرغ تاريخ الألوان المحفوظة، ويعيد ضبط جميع القيم.
الأسئلة الشائعة
س1: هل يمكنني استخدام هذه الأداة لاستخراج لون من صورة عبر الإنترنت (URL)؟
لا، الأداة تقبل الصور من جهازك فقط عن طريق التحميل أو الإفلات. لا يوجد خيار لإدخال رابط.
س2: كيف أعرف إذا كانت البيكسل شفافة؟
إذا كانت الصورة تحتوي على قناة ألفا، فسيظهر سطر منفصل: "الشفافية ‹ن›% – هذه البيكسل شفافة جزئياً." وإلا، فإن اللون معتم.
س3: لماذا تختلف ألوان البيكسلات المجاورة في منطقة تبدو موحدة اللون؟
يرجع ذلك غالباً إلى ضغط JPEG أو إلى تشويش مضاد التحبب (anti-aliasing). الصور المضغوطة تفقد بعض التفاصيل، مما يجعل البيكسلات تختلف قليلاً. يعرض التطبيق القيمة الدقيقة للبيكسل، وليس لوناً "متوسطاً".
س4: ما هو الحد الأقصى لعدد الألوان التي يمكنني حفظها؟
يمكنك حفظ حتى 12 لوناً في قائمة الاختيارات. عند تجاوز هذا العدد، يتم إزالة الألوان الأقدم تلقائياً؟ لا، الأداة تسمح فقط بـ12 عنصراً؛ إذا حاولت إضافة عنصر بعد ذلك، لن يتم الحفظ. لكن يجب مراجعة الوثائق، حيث تنص ورقة الحقائق على أن التاريخ يمكنه تخزين "حتى 12 عنصراً". ولكن عند الوصول إلى الحد، لا تذكر الورقة سلوكاً محدداً؛ الأفضل افتراض أنه لا يمكن حفظ المزيد حتى يتم حذف بعض الإدخالات.
س5: هل يمكنني نسخ قيمة HEX ومن ثم استخدامها في تطبيق مثل Photoshop؟
نعم، ما عليك سوى النقر على رمز HEX في الأداة لنسخه، ثم لصقه في حقل اللون في برنامج التصميم. الرمز يكون جاهزاً للاستخدام مباشرة (مثل #FF5733).
س6: ماذا يحدث إذا حاولت تحميل صورة متحركة بصيغة GIF؟
الأداة تعالج الصورة الثابتة المستندة إلى الإطار الأول. لن تعمل الرسوم المتحركة، وسيتم عرض الإطار الوحيد من الصورة.