مولد تدرج CSS
색상 정지점
0%
100%
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); آخر تحديث: 2026 · أداة مجانية عبر الإنترنت
ما هو مولد تدرج CSS؟
مولد تدرجات CSS مرئي ومجاني عبر الإنترنت: صمم تدرجات خطية وشعاعية ومخروطية، وأضف نقاط ألوان متعددة، واضبط الزاوية، ثم انسخ كود CSS الجاهز لخلفيات موقعك.
كيفية الاستخدام
- 1 اختيار النوع — اختر نوع التدرج (خطي، شعاعي، مخروطي).
- 2 ضبط نقاط التوقف اللونية — اضبط لون وموضع كل نقطة توقف لونية.
- 3 معاينة — تحقق من النتيجة في الوقت الفعلي في المعاينة.
- 4 نسخ كود CSS — انسخ كود CSS إلى الحافظة باستخدام زر 'نسخ'.
أدوات ذات صلة
مولد ظل CSS box-shadow مولّد CSS box-shadow مجاني عبر الإنترنت بعناصر تحكم في الإزاحة والتمويه والانتشار واللون والظل الداخلي inset، يعرض معاينة حية للظل ويُنتج كود CSS box-shadow جاهزًا للنسخ.
مولد CSS border-radius مولّد CSS border-radius مجاني عبر الإنترنت بثماني مقابض زوايا مستقلة وأشرطة تمرير، يعرض معاينة حية للشكل المدوّر ويُنتج كود CSS border-radius جاهزًا للنسخ لأي عنصر.
محوّل أكواد الألوان محول ألوان مجاني عبر الإنترنت يترجم فورًا بين أكواد HEX وRGB وHSL وOKLCH ويحسب نسبة تباين WCAG بين لونين حتى تتحقق من الامتثال لمعايير إمكانية الوصول بسهولة.
الأسئلة الشائعة
لا يوجد حد، لكن 2-6 هو المعتاد. الكثير قد يؤثر على الأداء.
نعم. قم بتفعيل مربع اختيار 'تكرار' لإضافة بادئة repeating.
يتم توفير خمسة إعدادات مسبقة: Sunset و Ocean و Forest و Midnight و Rainbow.
حالياً يتم إنتاج CSS نقي فقط. تحويل Tailwind مخطط له في تحديث مستقبلي.
لا. تتم جميع العمليات في المتصفح.