CSS ग्रेडिएंट कैसे बनाएं
- 1
रंग चुनें
कलर पिकर का उपयोग करके अपना पहला और दूसरा रंग चुनें या सीधे टेक्स्ट इनपुट में हेक्स कलर कोड दर्ज करें।
- 2
ग्रेडिएंट प्रकार चुनें
दिशात्मक रंग संक्रमणों के लिए लीनियर ग्रेडिएंट या केंद्र से बाहर की ओर गोलाकार रंग संक्रमणों के लिए रेडियल ग्रेडिएंट में से चुनें।
- 3
दिशा निर्धारित करें
लीनियर ग्रेडिएंट के लिए, तीर बटन का उपयोग करके दाएं, बाएं, ऊपर, नीचे और विकर्ण दिशाओं सहित 8 दिशा विकल्पों में से चुनें।
- 4
सीएसएस कोड कॉपी करें
'कॉपी सीएसएस' बटन पर क्लिक करके संपूर्ण बैकग्राउंड सीएसएस प्रॉपर्टी को अपने क्लिपबोर्ड पर कॉपी करें, जो आपकी स्टाइलशीट्स में पेस्ट करने के लिए तैयार है।
मुख्य विशेषताएँ
लीनियर और रेडियल ग्रेडिएंट
रंग चयन और ग्रेडिएंट दिशा पर पूर्ण नियंत्रण के साथ लीनियर और रेडियल दोनों ग्रेडिएंट बनाएं। ग्रेडिएंट प्रकारों के बीच तुरंत स्विच करें।
8 दिशा नियंत्रण
लीनियर ग्रेडिएंट के लिए 8 अलग-अलग दिशाओं में से चुनें, जिसमें सहज तीर नियंत्रणों के साथ क्षैतिज, लंबवत और विकर्ण अभिविन्यास शामिल हैं।
रैंडम रंग जनरेशन
अपने प्रोजेक्ट्स के लिए नए ग्रेडिएंट आइडिया और रचनात्मक रंग योजनाओं की खोज के लिए तुरंत रैंडम रंग संयोजन उत्पन्न करें।
तत्काल सीएसएस कॉपी
एक क्लिक से उत्पन्न CSS ग्रेडिएंट कोड को अपने क्लिपबोर्ड पर कॉपी करें। तत्काल कार्यान्वयन के लिए उपयोग के लिए तैयार CSS बैकग्राउंड प्रॉपर्टी।
CSS ग्रेडिएंट जनरेटर क्या है?
एक CSS ग्रेडिएंट जनरेटर एक ऐसा टूल है जो दो या दो से अधिक रंगों को सहज संक्रमणों में मिलाकर CSS बैकग्राउंड ग्रेडिएंट बनाता है। हमारा ग्रेडिएंट मेकर CSS linear-gradient और radial-gradient प्रॉपर्टीज़ उत्पन्न करता है जिनका सीधे वेब डेवलपमेंट में उपयोग किया जा सकता है। लीनियर ग्रेडिएंट दिशात्मक रंग संक्रमण बनाते हैं, जबकि रेडियल ग्रेडिएंट एक केंद्रीय बिंदु से गोलाकार संक्रमण बनाते हैं। यह टूल वास्तविक समय का पूर्वावलोकन प्रदान करता है और आधुनिक वेब मानकों के लिए ब्राउज़र-संगत CSS कोड उत्पन्न करता है।
हमारे ग्रेडिएंट जनरेटर का उपयोग क्यों करें?
- 1
वास्तविक समय का दृश्य पूर्वावलोकन
एक बड़े पूर्वावलोकन क्षेत्र के साथ अपने ग्रेडिएंट परिवर्तनों को तुरंत देखें जो दिखाता है कि आपका ग्रेडिएंट आपके वेब प्रोजेक्ट्स में कैसा दिखेगा।
- 2
परफेक्ट सीएसएस आउटपुट
उत्पन्न किया गया CSS कोड अनुकूलित और उपयोग के लिए तैयार है, जिसमें बैकग्राउंड प्रॉपर्टी के लिए उचित सिंटैक्स है, जो सभी आधुनिक ब्राउज़रों के साथ संगत है।
- 3
सहज दिशा नियंत्रण
ग्रेडिएंट दिशाओं को सेट करने के लिए उपयोग में आसान तीर बटन, जिससे आपकी डिज़ाइन के लिए आवश्यक सटीक अभिविन्यास बनाना आसान हो जाता है।
- 4
रचनात्मक प्रेरणा
रैंडम कलर जनरेटर नए रंग संयोजनों की खोज में मदद करता है और आपके ग्रेडिएंट डिज़ाइन और रंग योजनाओं के लिए रचनात्मक प्रेरणा प्रदान करता है।
अक्सर पूछे जाने वाले प्रश्न
लीनियर और रेडियल ग्रेडिएंट्स में क्या अंतर है?
लीनियर ग्रेडिएंट एक सीधी रेखा की दिशा में (क्षैतिज, लंबवत, या विकर्ण) रंग संक्रमण बनाते हैं, जबकि रेडियल ग्रेडिएंट गोलाकार रंग संक्रमण बनाते हैं जो एक केंद्रीय बिंदु से बाहर की ओर फैलते हैं।
क्या मैं कस्टम हेक्स कलर कोड का उपयोग कर सकता हूँ?
हाँ, आप कलर पिकर के बगल में टेक्स्ट इनपुट में सीधे कोई भी वैध हेक्स कलर कोड दर्ज कर सकते हैं। यह टूल #ff6b6b या #6bc1ff जैसे 6-अंकीय हेक्स कोड स्वीकार करता है।
मैं उत्पन्न सीएसएस कोड का उपयोग कैसे करूँ?
CSS कोड को कॉपी करें और उसे अपनी स्टाइलशीट में पेस्ट करें। उत्पन्न किया गया कोड एक पूर्ण बैकग्राउंड प्रॉपर्टी है जिसे आप ग्रेडिएंट प्रदर्शित करने के लिए किसी भी HTML एलिमेंट पर लागू कर सकते हैं।
क्या ग्रेडिएंट सभी ब्राउज़रों के साथ संगत हैं?
हाँ, उत्पन्न CSS मानक linear-gradient और radial-gradient सिंटैक्स का उपयोग करता है जो Chrome, Firefox, Safari और Edge सहित सभी आधुनिक ब्राउज़रों द्वारा समर्थित है।
क्या मैं दो से अधिक रंगों के साथ ग्रेडिएंट बना सकता हूँ?
वर्तमान में, हमारा टूल सरलता और स्वच्छ डिज़ाइन के लिए दो-रंगों वाले ग्रेडिएंट पर केंद्रित है। यदि आवश्यक हो तो आप अतिरिक्त रंग स्टॉप जोड़ने के लिए उत्पन्न CSS कोड को संशोधित कर सकते हैं।