मल्टी-स्टॉप CSS ग्रेडिएंट जनरेटर
जितने चाहें उतने कलर स्टॉप, टाइप (लीनियर या रेडियल) और एडजस्टेबल एंगल के साथ CSS ग्रेडिएंट बनाएँ, लाइव प्रीव्यू के साथ। कोड पूरी तरह आपके ब्राउज़र में तैयार और दिखाया जाता है।
यह कैसे काम करता है
दो से ज़्यादा रंगों पर CSS ग्रेडिएंट दृश्य रूप से कहीं ज़्यादा समृद्ध हो जाता है: तीन या अधिक स्टॉप से सूर्यास्त जैसे ट्रांज़िशन, होलोग्राफ़िक इफ़ेक्ट या आधुनिक लैंडिंग पेज का बैकग्राउंड बनाया जा सकता है। यह टूल आपको हर कलर स्टॉप को जोड़ने, (प्रतिशत में) पोज़िशन करने और हटाने की पूरी आज़ादी देता है, रियल-टाइम में अपडेट होते प्रीव्यू और कॉपी करने के लिए सटीक CSS कोड के साथ।
लीनियर और रेडियल ग्रेडिएंट में क्या अंतर है?
लीनियर ग्रेडिएंट (linear-gradient) तय एंगल पर सीधी रेखा में आगे बढ़ता है, जबकि रेडियल ग्रेडिएंट (radial-gradient) केंद्र बिंदु से शुरू होकर गोले की तरह बाहर की ओर फैलता है, एक ऐसा इफ़ेक्ट जो अक्सर रोशनी के हेलो या गोल सेक्शन बैकग्राउंड के लिए इस्तेमाल होता है।
कलर स्टॉप की पोज़िशन का क्या मतलब है?
पोज़िशन (प्रतिशत में) बताती है कि ग्रेडिएंट में किस जगह रंग अपनी पूरी तीव्रता पर पहुँचता है, उसके बाद अगले स्टॉप में घुलने लगता है। दो स्टॉप को पास लाने से उनके रंगों के बीच ट्रांज़िशन ज़्यादा तीखा होता है, जबकि उन्हें दूर रखने से धीरे-धीरे घुलता हुआ मिश्रण बनता है।
100% लोकल प्रोसेसिंग: ग्रेडिएंट बनाना और कोड तैयार करना सीधे आपके ब्राउज़र में होता है, कोई डेटा नहीं भेजा जाता।