ग्रेडिएंट जेनरेटर

लाइव प्रीव्यू के साथ सुंदर CSS ग्रेडिएंट बनाएं।

प्रीव्यू
%
%
background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);

ग्रेडिएंट जेनरेटर के बारे में

अपने वेब प्रोजेक्ट के लिए शानदार CSS ग्रेडिएंट बनाएं। कलर, पोजीशन और एंगल को कस्टमाइज़ करें। जेनरेट किए गए CSS कोड को सीधे अपनी स्टाइलशीट में कॉपी करें।

यह टूल क्या है?

हमारा CSS ग्रेडिएंट जनरेटर आपको रंग चुनकर, स्थान समायोजित करके और दिशा या कोण सेट करके दृश्य रूप से सुंदर रेखीय और रेडियल ग्रेडिएंट बनाने देता है। CSS कोड लाइव अपडेट होता है जैसे ही आप डिज़ाइन करते हैं, और आप इसे सीधे अपनी स्टाइलशीट में पेस्ट करने के लिए एक क्लिक से कॉपी कर सकते हैं। कोई डिज़ाइन सॉफ्टवेयर की जरूरत नहीं।

उपयोग कैसे करें

  1. ग्रेडिएंट प्रकार चुनें: रेखीय या रेडियल।
  2. कलर पिकर का उपयोग करके रंग बदलने के लिए किसी कलर स्टॉप पर क्लिक करें।
  3. ग्रेडिएंट बार पर क्लिक करके अधिक कलर स्टॉप जोड़ें।
  4. कलर स्टॉप को उनकी स्थिति समायोजित करने के लिए खींचें।
  5. रेखीय ग्रेडिएंट के लिए ग्रेडिएंट कोण या दिशा सेट करें।
  6. कॉपी बटन से जनरेट किया गया CSS कोड कॉपी करें।

सामान्य उपयोग के मामले

टिप्स और ट्रिक्स

अक्सर पूछे जाने वाले प्रश्न

रेखीय और रेडियल ग्रेडिएंट में क्या अंतर है?

रेखीय ग्रेडिएंट चयनित कोण पर एक सीधी रेखा के साथ रंगों में संक्रमण करता है, जबकि रेडियल ग्रेडिएंट केंद्र बिंदु से गोलाकार या दीर्घवृत्त पैटर्न में बाहर की ओर विकीर्ण होता है।

मैं अपने ग्रेडिएंट में दो से अधिक रंग कैसे जोड़ूं?

ग्रेडिएंट बार पर कहीं भी क्लिक करके एक नया कलर स्टॉप जोड़ें, फिर इसे क्लिक करके रंग असाइन करें और इसकी स्थिति को समायोजित करने के लिए इसे खींचें।

क्या मैं रेखीय ग्रेडिएंट का सटीक कोण नियंत्रित कर सकता हूं?

हाँ। कोण नियंत्रण का उपयोग करके डिग्री में कोई भी दिशा सेट करें, ऊपर से नीचे ग्रेडिएंट (180deg) से किसी भी कस्टम विकर्ण तक।

मैं जनरेट किया गया CSS को अपने प्रोजेक्ट में कैसे कॉपी कर सकता हूं?

CSS कोड आउटपुट के बगल में कॉपी बटन पर क्लिक करें — यह पूर्ण background: linear-gradient(...) या radial-gradient(...) घोषणा कॉपी करता है जो आपकी स्टाइलशीट में सीधे पेस्ट करने के लिए तैयार है।

क्या यह टूल जो ग्रेडिएंट बनाता है वह सहेजता है या अपलोड करता है?

नहीं। सब कुछ आपके ब्राउज़र में स्थानीय रूप से जनरेट और रेंडर किया जाता है — कोई ग्रेडिएंट डेटा सर्वर पर सहेजा या भेजा नहीं जाता।

हमारे मुफ्त ग्रेडिएंट जेनरेटर के साथ शानदार CSS ग्रेडिएंट बनाएं। लीनियर और रेडियल ग्रेडिएंट डिज़ाइन करें, कलर कस्टमाइज़ करें, CSS कोड तुरंत कॉपी करें।

ग्रेडिएंट जेनरेटर · css ग्रेडिएंट · लीनियर ग्रेडिएंट · रेडियल ग्रेडिएंट · ग्रेडिएंट बनाएं · कलर ग्रेडिएंट · css ग्रेडिएंट टूल · बैकग्राउंड ग्रेडिएंट · ग्रेडिएंट मेकर