SVG / आइकन
SVG स्प्राइट जनरेटर: Symbols और आइकन का उपयोग
कई SVG आइकन डालकर symbol sprite बनाएँ। मार्कअप को सुरक्षित करें, फ़ाइलनाम से बने ID को अद्वितीय बनाएँ, viewBox सुरक्षित रखें, fills को वैकल्पिक रूप से currentColor में बदलें और sprite.svg डाउनलोड करें।
SVG स्प्राइट जनरेटर: Symbols और आइकन का उपयोग: SVG आइकन का एक सेट डालें और हर आइकन के लिए एक symbol वाला sprite फ़ाइल पाएँ, साथ ही हर आइकन के उपयोग का स्निपेट भी पाएँ। Scripts, बाहरी संसाधन और असुरक्षित सामग्री हटा दी जाती है, ज़रूरत पड़ने पर dimensions को viewBox में बदला जाता है, और fills को currentColor में बदला जा सकता है ताकि आइकन टेक्स्ट के रंग के अनुसार दिखें। यह आपके ब्राउज़र में 100% स्थानीय रूप से चलता है और सर्वर पर कोई फ़ाइल अपलोड नहीं होती।
- श्रेणी
- डेवलपर टूल्स
- रन
- आपके ब्राउज़र में
- लागत
- मुफ़्त · साइन अप की ज़रूरत नहीं
- उपलब्धता
- इस्तेमाल के लिए तैयार
पूरी तरह आपके ब्राउज़र में चलता है
Scripts, event handlers, external resources, embedded images, टेक्स्ट और असमर्थित elements हटा दिए जाते हैं। Basic inline styles presentation attributes में बदल जाती हैं। Missing viewBox में numeric width और height का उपयोग होता है; हर missing dimension के लिए 24 units fallback होते हैं। उपयोग से पहले हर preview जाँचें।
SVG आइकन संपादित करेंसिंबल और पुनः उपयोग
SVG 2 symbol और use एलिमेंट तथा उनके viewBox व्यवहार को निर्दिष्ट करता है: https://www.w3.org/TR/SVG2/struct.html#SymbolElement ; https://www.w3.org/TR/SVG2/struct.html#UseElement
स्थानीय प्रोसेसिंग और पेंट
हर आइकन को सुरक्षित SVG एलिमेंट और एट्रिब्यूट की सूची से फिर बनाया जाता है, इसलिए स्क्रिप्ट, इवेंट हैंडलर और बाहरी संसाधन स्प्राइट तक नहीं पहुँच सकते। किसी तृतीय-पक्ष आइकन सेट को शामिल नहीं किया गया है। SVG पेंट और currentColor https://www.w3.org/TR/SVG2/painting.html पर निर्दिष्ट हैं। अपलोड किए गए आइकन के लाइसेंस की ज़िम्मेदारी उपयोगकर्ता की है।
इस्तेमाल करने का तरीका
- अधिकतम 60 SVG आइकन डालें, जिनमें से हर एक 1 MB से कम हो।
- सुरक्षित किए गए प्रीव्यू देखें और चाहें तो fills को currentColor में बदलें।
- स्प्राइट डाउनलोड करें और किसी आइकन को चुनकर उसका उपयोग स्निपेट कॉपी करें।
गोपनीयता और सीमाएँ
आपकी SVG फ़ाइलें आपके डिवाइस पर ही रहती हैं। यह टूल embedded URLs को fetch नहीं करता और आइकन अपलोड नहीं करता।
संबंधित टूल्स
अक्सर पूछे जाने वाले सवाल
मैं स्प्राइट का उपयोग कैसे करूँ?
पेज पर किसी hidden container में इसका SVG एक बार insert करें, फिर कॉपी किए गए inline snippets का उपयोग करें। अलग फ़ाइल के लिए href के रूप में sprite.svg#id का उपयोग करें।
जब viewBox मौजूद न हो, तब क्या होता है?
संख्यात्मक width और height, जिनमें px units भी शामिल हैं, एक नया viewBox तय करते हैं। कोई dimension न मिलने या समर्थित न होने पर डिफ़ॉल्ट रूप से 24 units लिए जाते हैं। प्रीव्यू में सुधारे गए viewBoxes को चिह्नित किया जाता है, ताकि आप cropping जाँच सकें।
क्या हर आइकन का बिल्कुल वही रूप बना रहेगा?
नहीं। Basic shapes, groups, gradients, clipping और masks सुरक्षित रखे जाते हैं, लेकिन scripts, text, embedded images, use elements और असमर्थित styling हटा दी जाती है। प्रीव्यू अवश्य जाँचें। अपलोड की गई artwork के licences की ज़िम्मेदारी आपकी है।
मुफ़्त टूल · आपके ब्राउज़र में बार चलता है · अकाउंट की ज़रूरत नहीं