सीएसएस ग्रेडिएंट जनरेटर एकाधिक रंग स्टॉप और कोण नियंत्रण के साथ सुंदर लीनियर, रेडियल और कोनिक सीएसएस ग्रेडिएंट बनाएं।

सीएसएस ग्रेडिएंट्स को बैकग्राउंड या बैकग्राउंड-इमेज संपत्ति का उपयोग करके परिभाषित किया जाता है। रेखीय ग्रेडिएंट्स में दिशा (डिग्री में कोण या सही जैसे कीवर्ड) के बाद रंग स्टॉप के साथ linear-gradient() फ़ंक्शन का उपयोग किया जाता है। प्रत्येक रंग स्टॉप में एक रंग मान और वैकल्पिक स्थिति प्रतिशत शामिल होता है। रेडियल ग्रेडिएंट्स में आकार (वृत्त या अंडाकार) और आकार कीवर्ड के साथ radial-gradient() का उपयोग किया जाता है। शंक्वाकार ग्रेडिएंट्स में conic-gradient() का उपयोग करके रंग संक्रमण की झाड़ू बनाई जाती है। कई रंग स्टॉप जटिल संक्रमण बनाते हैं - आप एक ही स्थिति पर दो स्टॉप का उपयोग करके कठोर रंग सीमाएं बना सकते हैं। प्रदर्शन के लिए, सीएसएस ग्रेडिएंट्स ब्राउज़र द्वारा रेंडर किए जाते हैं और छवि डाउनलोड की आवश्यकता नहीं होती है। वे रिज़ॉल्यूशन-स्वतंत्र हैं और किसी भी प्रदर्शन घनत्व पर तेज दिखाई देते हैं। पुराने ब्राउज़र समर्थन के लिए -webkit- उपसर्ग का उपयोग करें, हालांकि आधुनिक ब्राउज़र ग्रेडिएंट्स को उपसर्गों के बिना समर्थित करते हैं। ग्रेडिएंट्स को विभाजित करके जटिल दृश्य प्रभाव बनाने के लिए कई बैकग्राउंड मानों का उपयोग किया जा सकता है। background-size संपत्ति दोहराए जाने वाले पैटर्न बनाते समय प्रत्येक ग्रेडिएंट परत के आकार को नियंत्रित करती है।