مولِّد التدرّج اللوني CSS
إنشاء تدرّج لوني CSS
تعمل في متصفحك · بلا رفع
الأداة نفسها والتعليمات في هذه الصفحة باللغة الإنجليزية حاليًا. تعمل بالطريقة نفسها: كل شيء يجري في متصفحك.
Colors
Ready-made
متصفحك قديم جدًا لتشغيل هذه الأداة. حدِّثه، أو استخدم إصدارًا حديثًا من Chrome أو Edge أو Firefox أو Safari.
- لا شيء يغادر جهازك
- لا حدود للحجم يفرضها الخادم
- بلا تسجيل، بلا علامة مائية
- مجانية
How to make a CSS gradient
- Pick linear, radial or conic, or start from a ready-made gradient.
- Set the angle or center, and add, move or remove colors.
- Copy the CSS.
Good to know
- Each color can be partly see-through, which is handy for overlays on photos.
- "Repeat the pattern" turns the gradient into stripes or rings.
- The CSS includes a plain background color for very old browsers.
الأسئلة الشائعة
Will it work in all browsers?
Linear and radial gradients work everywhere; conic gradients work in all current browsers.
Is anything uploaded?
No. The preview is drawn by your browser.