एकाधिक रंग बिंदुओं और आधुनिक धुंधलापन (Blur) के साथ सुंदर और तरल बहु-रंगीन मेश ग्रेडिएंट पृष्ठभूमि बनाएं।
CSS मेश ग्रेडिएंट जनरेटर वेब डिजाइनरों, यूआई/यूएक्स कलाकारों और फ्रंटेंड डेवलपर्स के लिए आधुनिक वेब पेजों में तरल, जैविक और बहु-बिंदु मिश्रित रंगीन पृष्ठभूमि (Fluid Organic Backgrounds) तैयार करने का एक संवादात्मक विजुअल डिज़ाइन स्टूडियो है। पारंपरिक दो-रंग रैखिक (Linear) ग्रेडिएंट्स की तुलना में, मेश ग्रेडिएंट्स कैनवास पर कई अलग-अलग रंगीन रेडियल फोकल पॉइंट्स को आपस में मिश्रित करके एक समृद्ध, गतिशील और अत्याधुनिक सौंदर्यशास्त्र बनाते हैं, जो आधुनिक SaaS लैंडिंग पेजों और मोबाइल ऐप्स में अत्यंत लोकप्रिय है।
एक वास्तविक वेब डिज़ाइन परिदृश्य में, जब आप किसी हीरो सेक्शन या कार्ड घटक के लिए बैकग्राउंड बनाते हैं, तो टूल के इंटरैक्टिव कैनवास पर 4 से 6 रंगीन नियंत्रण बिंदुओं (Color Control Points) को ड्रैग करके मनचाही स्थिति में रखा जा सकता है। प्रत्येक बिंदु के लिए विशिष्ट हेक्स रंग, त्रिज्या (Radius) और अपारदर्शिता सेट करते ही वे आपस में सहजता से मिश्रित हो जाते हैं। नीचे दिया गया तैयार शुद्ध CSS3 कोड स्निपेट (जिसमें कई radial-gradient परतों का संयोजन होता है) तुरंत उत्पन्न हो जाता है जिसे भारी छवियों (Images) का उपयोग किए बिना सीधे अपनी वेबसाइट के स्टाइलशीट में पेस्ट किया जा सकता है।
आपकी रचनात्मक परियोजनाओं की पूर्ण सुरक्षा और गति के लिए, यह जनरेटर 100% क्लाइंट-साइड HTML5 Canvas और CSS इंजन में संचालित होता है। आपके डिज़ाइन पैरामीटर्स, रंग पैलेट या लेआउट कभी किसी बाहरी सर्वर पर अपलोड नहीं किए जाते हैं।
मेश बैकग्राउंड = background-color: बेस ; background-image: ⋃ [ radial-gradient(at xᵢ% yᵢ%, colorᵢ 0px, transparent radiusᵢ) ]
कैनवास पर प्रत्येक नियंत्रण बिंदु को एक स्वतंत्र रेडियल ग्रेडिएंट के रूप में परिभाषित किया जाता है; CSS में कई रेडियल परतों को स्टैक करके एक निर्बाध मेश मिश्रण प्रभाव प्राप्त किया जाता है।
radial-gradient एक उद्योग-मानक विनिर्देश है जो Chrome, Safari, Firefox, Edge और सभी आधुनिक मोबाइल ब्राउज़रों में 100% समर्थित है।