श्रेणी: डेवलपर टूल
CSS ग्रेडिएंट जनरेटर
रैखिक या रेडियल ग्रेडिएंट बनाएँ और CSS कॉपी करें
दो या तीन रंग चुनें, कोण तय करें, परिणाम सीधे देखें और चिपकाने के लिए तैयार background-image घोषणा कॉपी करें। सब कुछ आपके ब्राउज़र में रेंडर होता है।
आउटपुट
background-image: linear-gradient(135deg, #0f7b63 0%, #1f4f7a 100%);
इस पेज पर सब कुछ आपके ब्राउज़र में संसाधित होता है। कुछ भी अपलोड नहीं होता।
यह टूल क्या करता है
ग्रेडिएंट को हाथ से लिखने के बजाय आँख से परखना आसान है, इसलिए यह टूल बदलाव के साथ-साथ असली CSS को पूर्वावलोकन पट्टी पर चित्रित करता है। डिग्री में कोण वाला रैखिक ग्रेडिएंट या केंद्र से फैलता रेडियल ग्रेडिएंट चुनें, तीन पड़ावों के मिश्रण के लिए वैकल्पिक मध्य रंग जोड़ें, और घोषणा सीधे अपनी स्टाइलशीट में कॉपी करें।
इस्तेमाल कैसे करें
- रैखिक या रेडियल ग्रेडिएंट चुनें।
- प्रारंभिक और अंतिम रंग चुनें, चाहें तो मध्य रंग भी।
- कोण समायोजित करें और CSS घोषणा कॉपी करें।
निजता
यह टूल पूरी तरह आपके ब्राउज़र में चलता है। आपका डेटा कभी अपलोड, सेव या साझा नहीं होता — टैब बंद करते ही वह हट जाता है।
अक्सर पूछे जाने वाले सवाल
- क्या कुछ अपलोड होता है?
- नहीं। पूर्वावलोकन आपके ब्राउज़र द्वारा चित्रित CSS पृष्ठभूमि है और घोषणा पेज में ही बनती है, इसलिए सर्वर पर कुछ नहीं जाता।
- क्या वेंडर प्रीफ़िक्स चाहिए?
- मौजूदा ब्राउज़रों के लिए नहीं। बिना प्रीफ़िक्स वाले linear-gradient और radial-gradient वर्षों से समर्थित हैं।
- कोण किस दिशा में जाता है?
- CSS में 0deg नीचे से ऊपर जाता है और कोण घड़ी की दिशा में बढ़ता है, इसलिए 90deg बाएँ से दाएँ और 180deg ऊपर से नीचे चलता है।