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

यह टूल CSS ग्रेडिएंट के तीनों प्रकारों का समर्थन करता है: लीनियर (सीधी रेखा में रंग संक्रमण), रेडियल (केंद्र बिंदु से गोलाकार या अण्डाकार संक्रमण) और कोनिक (केंद्र बिंदु के चारों ओर घूमने वाले संक्रमण)।

अधिक कलर स्टॉप जोड़ने के लिए '+ स्टॉप जोड़ें' बटन पर क्लिक करें। प्रत्येक स्टॉप को विशिष्ट रंग (कलर पिकर या हेक्स इनपुट) और स्थिति (0-100%) के साथ कस्टमाइज़ किया जा सकता है।

लीनियर ग्रेडिएंट के लिए, 0 से 360 डिग्री तक दिशा नियंत्रित करने के लिए एंगल स्लाइडर का उपयोग करें। 0° नीचे से ऊपर, 90° बाएं से दाएं, 180° ऊपर से नीचे, 270° दाएं से बाएं ग्रेडिएंट बनाता है।

रेडियल ग्रेडिएंट के लिए, 'सर्कल' एक पूर्ण गोलाकार ग्रेडिएंट बनाता है, जबकि 'एलिप्स' एलिमेंट के आस्पेक्ट रेशियो से मेल खाता अंडाकार ग्रेडिएंट बनाता है।

हां! रेडियल ग्रेडिएंट को केंद्र, ऊपर, नीचे, बाएं, दाएं या किसी भी कोने पर पोजिशन किया जा सकता है। यह नियंत्रित करता है कि ग्रेडिएंट एलिमेंट के भीतर कहां से शुरू होता है।

टूल में 20 सुंदर प्रीसेट ग्रेडिएंट शामिल हैं जैसे सनसेट, ओशन, फॉरेस्ट, कैंडी, फायर, पर्पल, ऑरोरा आदि। किसी भी प्रीसेट बटन पर क्लिक करें।

दो कॉपी विकल्प हैं: 'CSS कॉपी करें' पूर्ण CSS नियम प्रदान करता है, और 'वैल्यू कॉपी करें' केवल ग्रेडिएंट वैल्यू प्रदान करता है।

ग्रेडिएंट के लिए कम से कम 2 कलर स्टॉप की आवश्यकता है। यदि केवल दो रह जाएं तो टूल स्टॉप हटाने की अनुमति नहीं देगा।

हालांकि ग्रेडिएंट आमतौर पर बैकग्राउंड के लिए उपयोग किए जाते हैं, इन्हें background-image, border-image और mask-image जैसे CSS प्रॉपर्टी पर लागू किया जा सकता है।

कोनिक ग्रेडिएंट रंग को केंद्र बिंदु के चारों ओर गोलाकार घुमाव में बदलते हैं, जैसे कलर व्हील। एंगल सेटिंग नियंत्रित करती है कि ग्रेडिएंट कहां से शुरू होता है।

हां, CSS ग्रेडिएंट Chrome, Firefox, Safari, Edge सहित सभी आधुनिक ब्राउज़र में अच्छी तरह समर्थित हैं।

बिल्कुल! प्रत्येक कलर स्टॉप को किसी भी समय संपादित किया जा सकता है। परिवर्तन तुरंत प्रिव्यू में दिखाई देते हैं।