اختر لونين أو أكثر، واسحب التدرج حسب الرغبة، وانسخ CSS. أو حمّله كـ PNG لاستخدامه كخلفية، أو خلفية شريحة، أو خلفية لمنشور على وسائل التواصل الاجتماعي. التدرجات الخطية والشعاعية والمخروطية مدعومة جميعاً، بالإضافة إلى وضع التدرج الشبكي للخلفيات الناعمة على نمط Apple التي تراها في واجهات المستخدم الحديثة.
أنواع التدرجات موضحة
- خطي: خط مستقيم من اللون A إلى اللون B. منتقي الاتجاه (من الأعلى إلى الأسفل، قطري، إلخ).
- شعاعي: متحد المركز — اللون A في المنتصف يتلاشى إلى اللون B عند الحواف. مفيد لتأثيرات الإضاءة المركزة.
- مخروطي: يدور حول نقطة مركزية مثل عجلة الألوان. رائج في تصميم واجهات المستخدم الحديثة.
- شبكي (مميز): بقع ألوان متعددة ممتزجة بسلاسة. مظهر "تدرج Apple".
ما يمكنك نسخه
- CSS: جاهز للصق
linear-gradient(...) أو تعريف background-image:.
- Tailwind: أقرب كلاس
bg-gradient-* بالإضافة إلى أي إضافات ألوان مخصصة.
- SVG: للاستخدام القابل للتوسع في الأيقونات أو رسومات واجهة المستخدم.
- تحميل PNG: بأي حجم، بما في ذلك خلفية الهاتف (1284×2778)، وسطح المكتب (3840×2160)، والمربع (1080×1080).
حالات الاستخدام الشائعة
- خلفيات الهواتف: التدرجات الشبكية ضخمة على iOS. جرب أداة معاينة خلفية iPhone للاختبار.
- خلفيات منشورات التواصل الاجتماعي: مظهر فوري يتناسب مع العلامة التجارية لرسومات الاقتباسات.
- أقسام البطل: الخلفيات المتدرجة موجودة في كل مكان في صفحات الهبوط.
- مجموعات الشرائح: استبدل الخلفيات الصلبة المملة.
اختيار الألوان المناسبة
المتجاورتان على عجلة الألوان = دقيق ومتناغم. المتقابلتان = جريء وملفت للانتباه. أضف نقطة توقف ثالثة في المنتصف لسد فجوة واسعة. للحصول على تدرجات مخلصة للعلامة التجارية، الصق HEX علامتك التجارية واختر صبغة أو ظل لنقطة التوقف الثانية. استخدم أداة محول الألوان للعثور على الصبغات (HSL مع إضاءة أعلى) أو الظلال (أقل).
الأسئلة الشائعة
هل يمكنني استخدام هذه في الإنتاج؟
نعم — تعمل CSS المنسوخة في أي متصفح حديث. يتم توفير بدائل SVG للأهداف القديمة.
ما هو دعم المتصفح للتدرج الشعاعي؟
عالمي في المتصفحات الحديثة. صيغة CSS هي سطر واحد.
ما هو الحد الأقصى لحجم تصدير PNG؟
المجاني: حتى 4K (3840×2160). المميز: 8K وأكثر.
هل يصعب استخدام التدرجات الشبكية؟
على الويب، تعتمد على SVG أو canvas. نقدم لك ملف PNG مسطح لسهولة الاستخدام، بالإضافة إلى مصدر SVG للتحرير.
هل يمكنني حفظ التدرجات اللونية الخاصة بي؟
قم بتسجيل الدخول (مجانًا) وستظهر التدرجات اللونية المحفوظة في مكتبتك.
ما هو التدرج 'المخروطي'؟
يدور حول نقطة — مثل عجلة الألوان أو المخطط الدائري. يدعمه CSS الحديث بشكل أصلي.
هل يعمل مع التدرجات المتحركة؟
التصدير الثابت فقط. للخلفيات المتحركة، انسخ CSS وأضف حركة CSS حول زاوية التدرج.
لماذا لا نكتب CSS يدويًا فقط؟
يمكنك ذلك — الأداة فقط تجعل التكرار البصري أسرع. انسخ وعدّل.
حول مُنشئ التدرجات
مُنشئ التدرجات هي أداة مجانية عبر الإنترنت من Wallpapers.com تعمل بالكامل في متصفحك — لا تثبيت، لا علامة مائية، لا حاجة للتسجيل بالبريد الإلكتروني للمحاولة الأولى.
أنشئ تدرجات خطية أو شعاعية مع إخراج CSS قابل للنسخ واللصق.
كيفية الاستخدام مُنشئ التدرجات
- اختر لونًا من العينة أو الصق قيمة HEX / RGB.
- ضبط المخرجات — اللوحة، التباين، الألوان التكميلية.
- انسخ القيمة، أو صدّر العيّنة بصيغة JSON.
متى تستخدمه
حالات الاستخدام الشائعة تشمل:
تجهيز الصور للرفع على الويب، قوائم التجارة الإلكترونية، منصات وسائل التواصل مع قيود الصيغة، وتحويل الملفات من جهاز أو تطبيق إلى آخر.
Free vs Premium
كل زائر يحصل على تجربة مجانية؛ المستخدمون المسجلون مجانًا يحصلون على حصة يومية أعلى. اشترك
مميز
لتشغيل غير محدود، معالجة دفعات حتى 200 صورة لكل مهمة، أولوية في الطابور، وتصفح بدون إعلانات.
أدوات ذات صلة
تبحث عن شيء مختلف قليلاً؟ جرب
منتقي الألوان من الصورة
,
مستخرج اللوحة
أو
محول التدرج الرمادي
— or browse all
أدوات الألوان أدوات.
