تخطي إلى المحتوى

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

اختر الألوان من صورة واحدة في المتصفح، وانسخ قيم HEX/RGB/CSS، واستخرج لوحة تمثيلية من 2-32 لونًا، وصدّر متغيرات CSS أو JSON مع دعم HEIC/HEIF.

اسحب وأفلت الصورة هنا أو انقر للتحديد

يدعم PNG / JPEG / WebP / AVIF / HEIC / HEIF

عدد الملفات

0 / 1

الحجم الإجمالي

0 bytes / 25 MB

حد الملف الواحد

25 MB

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

بداية سريعة

1
استورد صورة واحدة
2
انقر المعاينة وانسخ HEX/RGB/CSS
3
اختر حجم اللوحة (4/6/8/12/16/24/32)
4
استخرج الألوان التمثيلية
5
صدّر متغيرات CSS أو JSON

سيناريوهات شائعة

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

استخراج الألوان الأساسية والمميزة لمخطط الألوان

السمة/نظام التصميم

تصدير متغيرات CSS أو JSON للمشروع

تنسيق المكونات

استخراج ألوان متطابقة للأزرار والعلامات والمخططات

تناسق العلامة التجارية

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

خيارات منتقي الألوان واللوحة

عدد الألوان: 2-32، عادةً 8/12؛ الصور/التدرجات تشير إلى 16-32
أزرار الإعداد المسبق: 4/6/8/12/16/24/32 تبديل بنقرة واحدة
الفرز: حسب عدد العينات الكمية من الأعلى إلى الأدنى، والألوان الأكثر شيوعًا أولاً
الرقم بجوار اللون: يعرض عدد العينات المكممة من صورة اللوحة المختزلة
عقد التصدير: تستخدم متغيرات CSS: أسماء الجذر --color-1؛ يسرد JSON الفهرس/hex/css/rgb/count لكل لون من ألوان اللوحة.

نصائح الاستخدام

ابدأ بـ 8/12 لرؤية التأثير العام، ثم زد إلى 16/24/32 حسب الحاجة
عند الاستخدام في المشروع، أعد تسمية --color-1 إلى أسماء دلالية (مثل --color-primary)
أبقِ الصفحة في المقدمة عند استخراج صور كبيرة لتجنب تباطؤ المتصفح

القيود والتوافقية

يتم الاستخلاص التلقائي للوحة من أجل الأداء، والنتائج هي ألوان تمثيلية.
الدقة: يستخدم أخذ العينات بالنقر لوحة قماشية معروضة يصل حجمها إلى 2048 بكسل على الجانب الأطول؛ يستخدم استخراج اللوحة عينة بحجم 256 بكسل.
يتم إدخال HEIC/HEIF فقط؛ قد يفشل فك التشفير المحلي، لذا قم بالتحويل إلى PNG/JPEG إذا لزم الأمر.
معالجة ألفا: يمكن لـ CSS إخراج rgba(...);HEX/RGB لا تتضمن ألفا؛ يحتفظ JSON بألفا من خلال قيمة CSS.
حدود الإدخال: لا يوجد استيراد URL أو استيراد لصق أو قطارة الشاشة أو سير عمل ملحق المتصفح.
حدود اللون: لا يوجد تحويل HSL/CMYK/Pantone/LAB/OKLCH أو مدقق التباين أو مصفوفة WCAG.
حدود التصدير: لا يوجد تصدير لعينات ألوان Tailwind/SCSS/ASE/Figma/Procreate.

الخصوصية والأمان

يتم اختيار الألوان واستخراج اللوحة في المتصفح. تبقى الصورة المصدر في ذاكرة الصفحة ما دام هذا الأداة مفتوحة. قد يبقى إعداد عدد ألوان اللوحة في تخزين المتصفح؛ وإذا كانت مزامنة WebDAV مفعلة فقد يتزامن هذا الإعداد وفق إعداداتك. اللون المحدد واللوحة ورسالة الخطأ وبيانات تكبير / تحريك المعاينة هي حالة مراجعة وقت التشغيل، وقد تتزامن أيضًا عبر WebDAV state schema ما دامت موجودة. لا تتم مزامنة ملف الصورة افتراضيًا؛ ولا يدخل في مزامنة مرفقات WebDAV إلا إذا فعّلت مزامنة المرفقات صراحة. يتم إنشاء صادرات لوحة CSS/JSON عند التنزيل ولا تُحفظ كنتائج منفصلة. على جهاز مشترك، امسح عند الحاجة الصورة والألوان المحددة واللوحة والإعدادات المحفوظة وبيانات الموقع.

أسئلة شائعة

5

تابع الخطوة التالية باستخدام هذه الأدوات ذات الصلة.

تتم كل معالجة الأدوات محليًا داخل متصفحك.