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

लीनियर, रेडियल और मेश ग्रेडिएंट्स को दृश्य रूप से बनाएं

लीनियर या रेडियल ग्रेडिएंट्स बनाएं और CSS आउटपुट को कॉपी-पेस्ट करें।

दो या अधिक रंग चुनें, ग्रेडिएंट को अपनी पसंद के अनुसार ड्रैग करें, CSS कॉपी करें। या वॉलपेपर, स्लाइड बैकग्राउंड या सोशल-पोस्ट बैकड्रॉप के रूप में उपयोग करने के लिए PNG डाउनलोड करें। लीनियर, रेडियल और कोनिक ग्रेडिएंट सभी समर्थित हैं, साथ ही आधुनिक UI में दिखने वाली सॉफ्ट Apple-शैली की पृष्ठभूमि के लिए मेश-ग्रेडिएंट मोड भी।

ग्रेडिएंट प्रकारों की व्याख्या

लीनियर: रंग A से रंग B तक सीधी रेखा। दिशा चयनक (ऊपर→नीचे, विकर्ण, आदि)।
रेडियल: संकेंद्रित — केंद्र में रंग A किनारों पर रंग B में फीका होता है। स्पॉटलाइट प्रभावों के लिए उपयोगी।
कोनिक: कलर व्हील की तरह एक केंद्र बिंदु के चारों ओर घूमता है। आधुनिक UI डिज़ाइन में ट्रेंडी।
मेश (प्रीमियम): कई रंग के ब्लॉब्स सुचारू रूप से मिश्रित होते हैं। "Apple ग्रेडिएंट" लुक।

आप क्या कॉपी कर सकते हैं

CSS: पेस्ट करने के लिए तैयार linear-gradient(...) या background-image: घोषणा।
Tailwind: निकटतम bg-gradient-* क्लास और कोई भी कस्टम-रंग जोड़।
SVG: आइकन या UI ग्राफिक्स में स्केलेबल उपयोग के लिए।
PNG डाउनलोड: कोई भी आकार, जिसमें फोन वॉलपेपर (1284×2778), डेस्कटॉप (3840×2160) और वर्गाकार (1080×1080) शामिल हैं।

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

फोन वॉलपेपर: मेश ग्रेडिएंट iOS पर बहुत लोकप्रिय हैं। परीक्षण के लिए हमारा iPhone वॉलपेपर प्रीव्यू आज़माएं।
सोशल-पोस्ट बैकग्राउंड: कोट ग्राफिक्स के लिए तुरंत ब्रांड-अनुरूप लुक।
हीरो सेक्शन: लैंडिंग पेजों पर ग्रेडिएंट बैकड्रॉप हर जगह हैं।
स्लाइड डेक: उबाऊ ठोस पृष्ठभूमि को बदलें।

काम करने वाले रंग चुनना

कलर व्हील पर आसन्न = सूक्ष्म, सामंजस्यपूर्ण। विपरीत = बोल्ड, ध्यान आकर्षित करने वाला। चौड़े अंतर को पाटने के लिए तीसरा मध्य स्टॉप जोड़ें। ब्रांड-अनुरूप ग्रेडिएंट के लिए, अपना ब्रांड HEX पेस्ट करें और दूसरे स्टॉप के लिए टिंट या शेड चुनें। टिंट (उच्च चमक वाला HSL) या शेड (कम) खोजने के लिए हमारा रंग कनवर्टर उपयोग करें।

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

क्या मैं इन्हें उत्पादन में उपयोग कर सकता हूँ?

हाँ — कॉपी किया गया CSS किसी भी आधुनिक ब्राउज़र में काम करता है। पुराने ब्राउज़रों के लिए SVG फ़ॉलबैक प्रदान किए गए हैं।

रेडियल ग्रेडिएंट ब्राउज़र समर्थन के बारे में क्या?

आधुनिक ब्राउज़रों में सार्वभौमिक। CSS सिंटैक्स एक पंक्ति है।

मैं PNG को कितने बड़े आकार में निर्यात कर सकता हूँ?

मुफ्त: 4K (3840×2160) तक। प्रीमियम: 8K और उससे आगे।

क्या मेश ग्रेडिएंट का उपयोग करना कठिन है?

वेब पर वे SVG या कैनवास-आधारित होते हैं। हम आपको आसान उपयोग के लिए एक फ्लैटन किया हुआ PNG देते हैं, साथ ही संपादन के लिए SVG स्रोत भी देते हैं।

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

साइन इन करें (मुफ्त) और सेव किए गए ग्रेडिएंट्स आपकी लाइब्रेरी में दिखाई देंगे।

'कोनिक' ग्रेडिएंट क्या है?

एक बिंदु के चारों ओर घूमता है — जैसे कलर व्हील या पाई चार्ट। आधुनिक CSS इसे मूल रूप से सपोर्ट करता है।

क्या यह एनिमेटेड ग्रेडिएंट के लिए काम करता है?

केवल स्टैटिक एक्सपोर्ट। एनिमेटेड बैकग्राउंड के लिए, CSS कॉपी करें और ग्रेडिएंट एंगल के चारों ओर एक CSS एनिमेशन जोड़ें।

सीधे हाथ से CSS क्यों न लिखें?

आप लिख सकते हैं — यह टूल सिर्फ दृश्य पुनरावृत्ति को तेज़ करता है। कॉपी करें और ट्वीक करें।

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

ग्रेडिएंट जनरेटर Wallpapers.com का एक मुफ्त ऑनलाइन टूल है जो पूरी तरह आपके ब्राउज़र में चलता है — कोई इंस्टॉल नहीं, कोई वॉटरमार्क नहीं, पहले प्रयास के लिए कोई ईमेल साइन-अप नहीं। लीनियर या रेडियल ग्रेडिएंट्स बनाएं और CSS आउटपुट को कॉपी-पेस्ट करें।

उपयोग कैसे करें ग्रेडिएंट जनरेटर

स्वैच से रंग चुनें या HEX / RGB मान पेस्ट करें।
आउटपुट समायोजित करें — पैलेट, कंट्रास्ट, पूरक रंग
मान कॉपी करें या स्वैच को JSON के रूप में निर्यात करें

इसका उपयोग कब करें

सामान्य उपयोग के मामलों में शामिल हैं: वेब अपलोड, ई-कॉमर्स लिस्टिंग, प्रारूप बाधाओं वाले सोशल मीडिया प्लेटफॉर्म के लिए छवियाँ तैयार करना, और फ़ाइलों को एक डिवाइस या ऐप से दूसरे में बदलना

Free vs Premium

प्रत्येक आगंतुक को निःशुल्क परीक्षण मिलता है; साइन-इन किए गए निःशुल्क उपयोगकर्ताओं को उच्च दैनिक कोटा मिलता है। सदस्यता लें प्रीमियम असीमित रन, प्रति कार्य 200 छवियों तक बल्क प्रोसेसिंग, प्राथमिकता कतार, और विज्ञापन-मुक्त ब्राउज़िंग के लिए