تدرج CSS من صورة
استورد صورة فوتوغرافية أو رسمًا توضيحيًا: تُستخرج ألوانه السائدة ثم تُجمع تلقائيًا في تدرج CSS linear-gradient جاهز للنسخ. معالجة محلية 100% في متصفحك (WebAssembly) — لا تُرسل صورتك إلى خادم أبدًا.
كيف يعمل
استلهام الأجواء اللونية لصورة فوتوغرافية في خلفية قسم أو لافتة أو بطاقة منتج دون تكرار الصورة نفسها: هذا بالضبط ما تفعله هذه الأداة. فهي تحلل بكسلات الصورة المستوردة لاستخراج الدرجات اللونية الأكثر حضورًا، ثم تجمعها بالترتيب في تدرج خطي يمكنك ضبط زاويته قبل نسخ خاصية CSS النهائية.
هل يحافظ التدرج على ترتيب الألوان نفسه في الصورة؟
تُرتَّب الألوان من الأكثر تكرارًا إلى الأقل تكرارًا في الصورة المصدر، ويربط التدرج بينها بهذا الترتيب. وإن لم تعجبك النتيجة بصريًا، يمكنك نسخ الكود ثم إعادة ترتيب الألوان يدويًا في ورقة الأنماط.
كم لونًا ينبغي اختياره للحصول على نتيجة نظيفة؟
يعطي لونان أو ثلاثة ألوان عادةً تدرجًا مقروءًا وأنيقًا، قريبًا من خلفية قسم كلاسيكية. وبعد أربعة ألوان، قد تقترب النتيجة من قوس قزح أكثر من تدرج رقيق، ويحسن حصر ذلك في التأثيرات المقصودة القوية.
الخصوصية: يتم استخراج الألوان وتوليد كود CSS بالكامل في متصفحك عبر WebAssembly، دون رفع صورتك إلى خادم.