🌈 CSS ग्रेडिएंट जेनरेटर
कुछ ही सेकंड में खूबसूरत लाइनर या रेडियल CSS ग्रेडिएंट बनाएं - रंग चुनें, कोण या आकृति को समायोजित करें, जितने रंग ब्रेक आवश्यक हों उतने जोड़ें, और एक क्लिक में तैयार CSS कोड कॉपी करें। पूरी तरह से फ्री और आपके ब्राउज़र में पूरी तरह से चलता है।
डिज़ाइन से ही निजी. यह टूल पूरी तरह आपके ब्राउज़र में चलता है — आपका डाला हुआ कुछ भी अपलोड या सेव नहीं होता, और यह ऑफ़लाइन भी काम करता है।
परिचय
यह उपकरण आपको कोड लिखे बिना CSS ग्रेडिएंट दृश्य रूप से बनाने की अनुमति देता है। linear-gradient या radial-gradient के बीच चुनें, कोण या आकृति सेट करें, रंग चुनने वाले टूल और स्थिति स्लाइडर के साथ रंग ब्रेक को प्रबंधित करें, और वास्तविक समय में परिणाम की जांच करें। आठ बिल्ट-इन प्रीसेट (सूर्यास्त, महासागर, ऑरियन, नीओन आदि) आपको एक शुरुआत देते हैं। क्योंकि सभी ऑपरेशन आपके ब्राउज़र में पूरी तरह से स्थानीय रूप से चलते हैं शुद्ध जावास्क्रिप्ट के उपयोग से, कोई रंग डेटा या डिज़ाइन जानकारी आपके डिवाइस से कभी भी बाहर नहीं जाती है - कोई सर्वर, कोई खाता।
कैसे उपयोग करें
- ग्रेडिएंट प्रकार से लाइनर या रेडियल का चयन करें ग्रेडिएंट प्रकार ड्रॉपडाउन से।
- लाइनर ग्रेडिएंट के लिए, स्लाइडर या संख्या इनपुट के उपयोग से कोण (0-360°) सेट करें। रेडियल ग्रेडिएंट के लिए, आकृति के रूप में एलिप्स या सर्कल का चयन करें।
- रंग ब्रेक पैनल में एक रंग स्वैच्छिक चुनें और रंग चुनने वाले टूल को खोलें, फिर स्थिति इनपुट को खींचें और प्रत्येक ब्रेक को आपके चाहे वाले स्थान पर रखें।
- + ब्रेक जोड़ें बटन के दबाने से एक नए रंग ब्रेक को जोड़ें जो स्वचालित रूप से ग्रेडिएंट में सबसे बड़े अंतर में रखा जाता है, या ✕ बटन के दबाने से कोई भी ब्रेक हटा दें (मिनिमम 2 ब्रेक आवश्यक हैं)।
- कॉपी CSS बटन के दबाने से तैयार बैकग्राउंड: linear-gradient(…) या radial-gradient(…) घोषणा को आपके क्लिपबोर्ड में कॉपी करें और आपके स्टाइलशीट में सीधे पेस्ट करें।
सामान्य प्रश्न
- CSS ग्रेडिएंट जेनरेटर का उपयोग फ्री है?
- हां, पूरी तरह से फ्री - कोई सब्सक्रिप्शन, कोई खाता, और कोई छिपा हुआ उपयोग सीमा नहीं। पृष्ठ खोलें और तुरंत ग्रेडिएंट बनाना शुरू करें।
- इस टूल का उपयोग ऑफ़लाइन के बिना इंटरनेट कनेक्शन के काम करता है?
- हां। एक बार पृष्ठ लोड हो जाने के बाद, पूरा टूल ऑफ़लाइन काम करता है, कोई बाहरी API कॉल, CDN निर्भरता, या सर्वर अनुरोध नहीं। यह एक विमान में या एक नेटवर्क सीमित वातावरण में सुरक्षित उपयोग के लिए है।
- मेरा रंग डेटा या डिज़ाइन कोई सर्वर पर भेजा जाता है?
- नहीं। सभी ग्रेडिएंट उत्पादन और प्रीव्यू रेंडरिंग आपके ब्राउज़र में स्थानीय रूप से जावास्क्रिप्ट के उपयोग से होता है। आपके रंग चयन केवल आपके ब्राउज़र के localStorage में संग्रहीत होते हैं और कहीं भी ट्रांसमिट नहीं किए जाते हैं।
- लाइनर-ग्रेडिएंट और रेडियल-ग्रेडिएंट के बीच क्या अंतर है?
- एक लाइनर-ग्रेडिएंट एक दिए गए कोण (जैसे 135deg) के साथ एक सीधी रेखा के अनुदिश रंगों के बीच बदलता है। एक रेडियल-ग्रेडिएंट एक अंडाकार या वृत्त आकृति में एक केंद्र बिंदु से बाहर रंगों के बीच फैलता है। दोनों मानक CSS उत्पन्न करते हैं जो सभी आधुनिक ब्राउज़र में काम करते हैं।
- मैं कितने रंग ब्रेक जोड़ सकता हूं?
- कोई बिल्ट-इन सीमा नहीं - आप जितने रंग ब्रेक आवश्यक हों उतने जोड़ सकते हैं (मिनिमम 2)। नए ब्रेक ग्रेडिएंट में सबसे बड़े अंतर में स्वचालित रूप से रखे जाते हैं और उस स्थिति में अंतर्विस्तृत रंग पूर्व भर दिया जाता है एक चलते शुरुआत के लिए।
- क्या यह टूल मेरा डेटा अपलोड करता है?
- नहीं। सब कुछ आपके ब्राउज़र में ही चलता है, इसलिए आपका डेटा कभी आपके डिवाइस से बाहर नहीं जाता — पेज लोड होने के बाद यह ऑफ़लाइन भी काम करता है।