ग्रेडिएंट जनरेटर
ड्रैगेबल मल्टी-स्टॉप कंट्रोल और क्यूरेटेड प्रीसेट्स के साथ लीनियर, रेडियल और कोनिक CSS ग्रेडिएंट बनाएं। पेस्ट-रेडी CSS तुरंत कॉपी करें।
background: -;
सब कुछ आपके ब्राउज़र में लाइव कम्प्यूट होता है: कोई साइन-अप नहीं, बिल्कुल फ्री।
ग्रेडिएंट जनरेटर के बारे में
Gradient Generator शुरू से कस्टम CSS ग्रेडिएंट बनाता है। एक linear, radial या conic टाइप चुनें, कोण सेट करें, और एक मल्टी-स्टॉप एडिटर से ब्लेंड को आकार दें: स्टॉप हिलाने के लिए हैंडल खींचें, नए जोड़ने के लिए बार पर क्लिक करें, और किसी पिकर से किसी भी स्टॉप का रंग बदलें: लाइव प्रीव्यू काम करते ही अपडेट होता है।
क्यूरेट किए गए प्रीसेट आपको एक मज़बूत शुरुआती बिंदु देते हैं जब आप खाली स्लेट से शुरू नहीं करना चाहते, और एक-क्लिक एक्शन (random, reverse, rotate 45°) एक्सप्लोरेशन को तेज़ बनाते हैं। जनरेट किया गया CSS हमेशा दिखाई देता है और प्रीव्यू के साथ सिंक रहता है, इसलिए जो आप कॉपी करते हैं वह ठीक वही है जो आपने देखा।
सब कुछ आपके ब्राउज़र में बिना किसी लागत के लाइव गणना होता है। पूरा CSS नियम या सिर्फ बैकग्राउंड मान कॉपी करें और इसे किसी स्टाइलशीट, बटन स्टाइल या हीरो सेक्शन में पेस्ट करें: बैकग्राउंड, ओवरले और UI एक्सेंट के लिए एक सीधा-सादा CSS ग्रेडिएंट जनरेटर।
ग्रेडिएंट जनरेटर का उपयोग कैसे करें
- एक ग्रेडिएंट टाइप चुनें: linear, radial या conic।
- किसी प्रीसेट से शुरू करें या तुरंत शुरुआती बिंदु के लिए "Random" पर क्लिक करें।
- रंगों को स्थिति देने के लिए स्टॉप हैंडल खींचें, स्टॉप जोड़ने के लिए बार पर क्लिक करें, और हर स्टॉप का रंग संपादित करें।
- कोण समायोजित करें, या ब्लेंड को फिर से दिशा देने के लिए "Reverse" और "Rotate 45°" का उपयोग करें।
- CSS नियम या बैकग्राउंड मान कॉपी करें और इसे अपने प्रोजेक्ट में पेस्ट करें।