كيف تصنع تدرّجك
تعمل الأداة بطريقتين تختارهما من الأزرار في الأعلى. فهي تفتح على وضع التطبيق فوق صوري ومنطقة الرفع جاهزة: اسحب صورة أو أكثر — والصيغ المقبولة JPG وPNG وWEBP وGIF وBMP — فيُرسم التدرّج فوق كل واحدة منها. وعند تحميل أكثر من صورة تظهر ألسنة بأسماء الملفات فوق المعاينة لتنتقل بينها. أما الزر الثاني، إنشاء خلفية من الصفر، فلا يتطلب رفع أي شيء: تحدّد الألوان ونوع التدرّج والمقاس، فتُولَّد الصورة في الحال.
للتدرّج أربعة أنواع. فالخطي يصنع الانتقال في خط مستقيم، بزاوية يتحكم بها شريط التمرير وفق العرف نفسه المعتمد في CSS، حيث تشير الدرجة صفر إلى الأعلى. والدائري ينطلق من المركز وينتشر في دائرة. والمخروطي يدير الألوان حول النقطة المركزية فينتج أثر المروحة الشائع في الخلفيات الحديثة. أما «بلا» فيوقف التدرّج: فوق صورك تبقى الصورة كما هي ولا تتلقى سوى اللمسات النهائية؛ وفي وضع إنشاء الخلفية يتحول اللون الأول إلى لون صلب. وتأتي الألوان أسفل ذلك مباشرة: كل صف يضم منتقي اللون، ومقبض موضع بالنسبة المئوية، وزر إزالة. ويمكنك استخدام محطتين لونيتين حتى ست، ويُدرج زر إضافة لون محطة جديدة بين الموجودة. وإن فضّلت البدء من شيء جاهز، فشبكة اللوحات تضم اثنتي عشرة توليفة مجرّبة، بينما يسحب زر التدرّج العشوائي ألوانًا وزاوية جديدة مع كل ضغطة.
تُطبَّق الخامات الست فوق التدرّج وشدتها قابلة للضبط. فالحبيبات تضيف حَبًّا أحادي اللون: تغيّر سطوع البكسلات وحده دون المساس باللون، وهي الوسيلة الأكثر استخدامًا لإزالة الشرائط التي تظهر في التدرّجات الملساء. ويفعل ضجيج الألوان العكس — يغيّر اللون وحده ويبقي السطوع سليمًا، فينتج مظهر صورة التُقطت بحساسية ISO عالية. وترسم الخطوط سطورًا مائلة، بينما تنشئ النقاط تراميًا منتظمًا، وكلاهما مفيد لخلفيات ذات نمط رسومي. أما الورق فيجمع بين حَبّ ناعم وتعتيم خفيف عند الحواف، محاكيًا الورق المطبوع. وإلى جانب الخامات هناك لمستان نهائيتان. فالفينييت يعتّم كل الحواف تدريجيًا فيركّز النظر في المنتصف. والتدرّج الجانبي يفعل الشيء نفسه على جانب واحد — الأعلى أو الأسفل أو اليسار أو اليمين — بأربعة أنواع: التعتيم لاستقبال نص فاتح، والتفتيح لنص داكن، واستخدام اللون الأول من التدرّج، أو تلاشي الحافة حتى الشفافية. ويحدّد مقبضا الامتداد والشدة إلى أي مدى يمتد الشريط وكم يثقل. وكلاهما يُطبَّق أخيرًا بعد كل شيء، فيعملان بالطريقة نفسها في الوضعين ولا يتأثران بالمزج. وفي وضع التطبيق يوجد كذلك مقبض الشفافية وستة أوضاع مزج تحدّد كيف يتفاعل التدرّج مع الصورة تحته.
وفي وضع إنشاء الخلفية، اختر أحد المقاسات الستة الجاهزة — Full HD أو المربّع أو الستوري أو الصورة المصغّرة أو Open Graph أو خلفية الشاشة — أو اكتب العرض والارتفاع في الحقول المخصّصة حتى 6000 بكسل لكل ضلع. ويعرض بلوك كود CSS التعريف المكافئ للتدرّج الحالي، وينسخ الزر كل شيء إلى الحافظة جاهزًا للصقه في ملف التنسيقات لديك. وأخيرًا اختر PNG أو JPG أو WEBP ونزّل الصورة؛ وفي وضع التطبيق مع عدة صور، يسلّمك زر تنزيل الكل الدفعة في ملف .zip واحد.
الأسئلة الشائعة
هل تُخزَّن الصور التي أرفعها في أي مكان؟
لا. يُرسم التدرّج داخل متصفحك، وصور وضع التطبيق لا تُرسَل إلى الإنترنت أبدًا. ولا يُحفظ شيء على أي خادم.
هل يلزم رفع صورة لاستخدام الأداة؟
لا. في وضع إنشاء خلفية من الصفر تختار الألوان والمقاس فقط، ويُنشأ الملف مباشرة. أما رفع الصور فيلزم في وضع التطبيق وحده، حيث يُرسم التدرّج فوق صورك.
ما الفرق بين تنزيل الصورة ونسخ كود CSS؟
ينشئ كود CSS التدرّج مباشرة في متصفح زائر موقعك دون تنزيل أي ملف — وهو الخيار الأخف، بلا استهلاك للنطاق، والأنسب لخلفيات الأقسام والأزرار. أما الصورة بصيغة PNG أو JPG فتلزم حين لا تفهم الوجهة كود CSS، كغلاف ستوري أو صورة مصغّرة لفيديو أو شريحة عرض أو خلفية شاشة. وتذكّر أن الملمس موجود في الصورة المصدَّرة وحدها: فتدرّجات CSS بلا حبيبات.
ما المقاس المناسب لكل شبكة أو استخدام؟
تغطي المقاسات الجاهزة أكثر الحالات شيوعًا: 1080×1080 للمنشور المربّع على إنستغرام وفيسبوك، و1080×1920 للستوري والريلز، و1280×720 للصورة المصغّرة على يوتيوب، و1200×630 لصورة المشاركة في Open Graph التي تظهر في واتساب ولينكدإن، و1920×1080 للشرائح، و2560×1440 لخلفية الشاشة. وإن احتجت مقاسًا آخر، فاكتب العرض والارتفاع في الحقول المخصّصة، حتى 6000 بكسل لكل ضلع.
ما فائدة الملمس الحبيبي في التدرّج؟
تُظهر التدرّجات الملساء على شاشات 8 بت شرائط لونية واضحة، وهو عيب يُعرف بالتشريط، خاصةً حين يتقارب اللونان. وطبقة خفيفة من الحبيبات بنسبة 20 إلى 40% تكسر تلك الشرائط وتجعل الانتقال يبدو متصلًا. كما يمنح الحَبّ لمسة مطبوعة صارت شائعة في الهويات البصرية وأغلفة المشاريع.
كيف أطبّق التدرّج فوق صورة دون أن يطمس ما فيها؟
اختر وضع التطبيق فوق الصور وابدأ بشفافية بين 40 و60%. وتغيّر أوضاع المزج النتيجة كثيرًا: «الضرب» يعتّم ويصلح لوضع نص فاتح فوقه، و«الشاشة» يفتّح، و«اللون» يصبغ الصورة مع الحفاظ على تباينها الأصلي — وهو الوضع الأكثر حفظًا للتفاصيل. وللأغلفة التي تحمل عنوانًا، يضمن تدرّج داكن بوضع الضرب في الجزء السفلي وضوح القراءة دون إخفاء الصورة.
هل أستخدم الملمس أو الفينييت وحدهما بلا تدرّج؟
نعم. اختر «بلا» في الخيار الأول، أي نوع التدرّج. فوق صورك تمرّ الصورة كما هي ولا تتلقّى إلا ما تشغّله بعد ذلك — حبيبات أو فينييت أو تدرّجًا جانبيًا — ما يجعل الأداة مفيدة لإضفاء لمسة فيلمية على صورة دون تغيير ألوانها. أما في وضع إنشاء خلفية من الصفر، فيستخدم خيار «بلا» اللون الأول خلفيةً صلبة، وهو مفيد لتوليد لون مسطّح بحبيبات.
ما الفرق بين الحبيبات وضجيج الألوان؟
كلاهما ينثر تباينًا عشوائيًا على البكسلات، لكن في محورين متعاكسين. فالحبيبات تغيّر السطوع وحده وتترك اللون كما هو، محاكيةً حَبّ الفيلم — وهي ما يكسر الشرائط الظاهرة في التدرّجات الملساء. أما ضجيج الألوان فيغيّر اللون وحده ويبقي السطوع سليمًا، فينتج نقاطًا ملوّنة تشبه صورة التُقطت بحساسية ISO عالية. وعمليًا: استخدم الحبيبات للمسة النهائية ولمعالجة التشريط، وضجيج الألوان حين تريد مظهر الصورة التناظرية أو الشاشة القديمة.
ما فائدة الفينييت وما الشدة المناسبة له؟
يعتّم الفينييت الحواف تدريجيًا ويدفع الانتباه نحو مركز الصورة — وهو أسلوب كلاسيكي في التصوير وأغلفة الفيديو، حيث يحتاج الوجه أو المنتج إلى منافسة الخلفية. وبين 30 و50% يبقى الأثر خفيفًا لا يكاد يُلاحظ، وهو الأفضل عادةً؛ أما فوق 70% فيصبح ظاهرًا ويكتسب طابعًا دراميًا. ولأن الفينييت يُرسم أخيرًا بعد التدرّج، فإن وضع المزج المختار لا يؤثر في نتيجته.
كيف أعتّم الجزء السفلي وحده من الصورة لوضع عنوان؟
شغّل التدرّج الجانبي واختر الحافة التي سيقع النص عندها، مع إبقاء النوع على التعتيم. والوضع الافتراضي هو الجانب الأيسر، وهو يخدم الحالة الأشيع لبانر بعنوان على جانب وصورة على الآخر؛ أما لغلاف فيديو بعنوان في الأسفل، فبدّل إلى القاعدة. وامتداد بين 35 و50% مع شدة تدور حول 75% يمنح النص الأبيض تباينًا كافيًا دون إخفاء موضوع الصورة.
هل أطبّق التدرّج نفسه على عدة صور دفعة واحدة؟
نعم. في وضع التطبيق، ارفع ما تشاء من الصور: تُطبَّق الألوان والملمس والشفافية والمزج نفسها على الجميع، ويسلّمك التنزيل بصيغة .zip الدفعة كاملة. وهو أسرع طريق لتوحيد أغلفة المدونة أو الصور المصغّرة لقناة.