تخطى للمحتوى
Calnex LogoCalnex
design

منتقي الألوان من الصور

استخرج الألوان الدقيقة من أي صورة تقوم برفعها. انقر فوق أي بكسل للحصول على أكواد HEX و RGB و HSL الدقيقة فوراً للتصميم وتطوير المواقع.

اسحب وأسقط صورة هنا، أو انقر للتصفح

يدعم PNG و JPG و GIF و WebP و BMP

لماذا تختار منتقي الألوان من الصور

تتيح لك أداة منتقي الألوان من الصور (أداة القطارة) إمكانية رفع أي صورة واستخراج الكود اللوني الدقيق لأي بكسل بضغطة زر واحدة. تم تجهيز الأداة بعدسة مكبرة للبكسلات لتسهيل استهداف النقاط الدقيقة حتى في التصميمات المعقدة. تعمل الأداة بالكامل داخل المتصفح لضمان أمان ملفاتك بنسبة 100% دون رفع الصور لأي خادم.

  • ✓استخراج أكواد HEX و RGB و HSL لأي بكسل فوراً عند النقر
  • ✓عدسة تكبير متغيرة (من 2x إلى 16x) لضمان دقة الاستهداف المطلقة
  • ✓صندوق معاينة ذكي يضبط تباين النصوص تلقائياً بحسب درجة اللون
  • ✓لوحة سجل الألوان للاحتفاظ بآخر 10 ألوان قمت بالتقاطها
  • ✓ميزة النسخ بضغطة زر واحدة لكافة صيغ الألوان لاستخدامها في ملفات CSS
  • ✓معالجة محلية كاملة داخل جهازك دون رفع أي بيانات للخارج

خطوات الاستخدام

  1. 1قم بسحب الصورة وإفلاتها في منطقة الرفع أو انقر لتحديدها من جهازك
  2. 2مرر مؤشر الفأرة فوق الصورة واستعن بالعدسة المكبرة لمعاينة البكسلات
  3. 3عدّل شريط التكبير لرفع أو خفض نسبة دقة رؤية الأبعاد عند الحاجة
  4. 4انقر فوق البكسل المستهدف لتأكيد اختيار اللون وقراءة رموزه
  5. 5شاهد اللون المستخرج بتنسيقات HEX و RGB و HSL بجانب عينة المعاينة.
  6. 6انسخ صيغة كود اللون الذي تحتاجه مباشرة إلى الحافظة
  7. 7راجع سجل الألوان الملتقطة مسبقاً لإعادة استعمال أي لون بسرعة

الأسئلة الشائعة (FAQ)

كيف يعمل منتقي الألوان لاستخلاص البيانات من الصور؟

تقوم الأداة برسم الصورة المدخلة على عنصر Canvas (HTML5) غير مرئي، ثم تستدعي واجهة البرمجة getImageData() لقراءة قيم RGBA الأصلية للبكسل الذي قمت بالنقر عليه لتوفير قيم لونية دقيقة وموثوقة.

ما هي الفائدة الأساسية من عدسة تكبير البكسلات؟

تساعد العدسة على تكبير التفاصيل المعقدة جداً لعرض شبكة البكسلات بشكل واضح حول المؤشر، مما يمكنك من التقاط لون خط رفيع أو نقطة صغيرة جداً في الصورة. تتيح العدسة مستويات تكبير بين 2x و 16x.

لماذا تعرض الأداة ثلاثة تنسيقات مختلفة للألوان؟

لتلبية متطلبات بيئات العمل المختلفة. رمز HEX هو المعيار الشائع لتطوير الويب وملفات CSS، بينما يفيد تنسيق RGB عند ضبط الشفافية (rgba)، ويعتبر HSL الأسهل لتعديل السطوع أو التشبع يدوياً.

أين يتم حفظ سجل الألوان الملتقطة؟

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

هل تعمل القطارة مع صور PNG الشفافة؟

نعم، تقرأ الأداة قنوات الشفافية (Alpha) للبكسلات. إذا كان البكسل شفافاً تماماً، فستعكس القيمة لون خلفية لوحة الرسم، أما إذا كان شبه شفاف فستحصل على قيمة البكسل المخزنة.

ما هي صيغ الصور المدعومة في الأداة؟

تدعم الأداة كافة التنسيقات التي يستطيع متصفحك عرضها بشكل طبيعي، بما في ذلك PNG و JPG و JPEG و WebP و GIF (الإطار الأول) و BMP و SVG.

مراجع ومصادر موثوقة

Canvas API - MDN Web Docs

عرض المصدر

ImageData - MDN Web Docs

عرض المصدر

CSS Color Module Level 4 - W3C

عرض المصدر

WCAG 2.1 Relative Luminance

عرض المصدر