आइकॉन को वेक्टराइज़ कैसे करें
6 मिनट पढ़ें · 2 अग॰ 2026 को प्रकाशित · 2 अक्टू॰ 2026 को अपडेट किया गया
आइकॉन एक ही समय में हर साइज़ पर जिया करता है. वही फ़ाइल मेन्यू में 16-पिक्सल आइटम है, बटन में 24-पिक्सल, ऐप टाइल में 512-पिक्सल और कभी-कभी पोस्टर. यह तभी चलता है जब नीचे की ज्यामिति ईमानदार हो: कम नोड, बंद पाथ, और जिस रैस्टर से शुरुआत की, उसके एंटी-एलियासिंग की कोई बची-खुची किनारी नहीं.
इसलिए आइकॉन वेक्टराइज़ करना कन्वर्ज़न से कम, उसे क्या खिलाते हैं और बाद में उसमें से क्या छाँटते हैं, उससे ज़्यादा है. यह गाइड दोनों को छूती है.
सबसे बड़े उपलब्ध रैस्टर से शुरू करें, फिर उसे फ्लैट करें
यहाँ एंटी-एलियासिंग ही दुश्मन है. 32-पिक्सल आइकॉन में हर तिरछी रेखा के साथ के नरम स्लेटी पिक्सल इमेज का बड़ा हिस्सा होते हैं, और इंजन के पास यह जानने का कोई रास्ता नहीं कि वे कोई सख़्त किनारा थे, कोई असली बीच का रंग नहीं. उसे 512-पिक्सल वर्ज़न दें और वही किनारा बाक़ी उनचास साफ़ पिक्सलों के बीच एक-पिक्सल का बदलाव बन जाता है — शेप को ग़लत पहचानना नामुमकिन है.
अगर आइकॉन मोनोक्रोम है, तो कन्वर्ट करने से पहले उसे सचमुच मोनोक्रोम बनाएँ: पारदर्शी पर ख़रा काला, या सफ़ेद पर ख़रा काला — न कोई हल्की शैडो, न कोई महीन इनर ग्लो. इनमें से हर इफ़ेक्ट आउटपुट में शेप्स बन जाता है, और आउटपुट की शेप्स यानी वे नोड जिन्हें आपको ढूँढकर हटाना है.
नतीजे को नोड की संख्या से आँकें, 100% पर दिखने से नहीं
आप जिस साइज़ में उसे देख रहे हैं, लगभग कोई भी ट्रेस ठीक दिखता है. असली परीक्षा नोड की संख्या है: पाथ खोलें और पॉइंट गिनें. अच्छी तरह बने आइकॉन में पॉइंट सिर्फ़ वहीं होते हैं जहाँ कर्व सचमुच दिशा बदलता है — गोल कोनों वाले वर्ग में आठ, वृत्त में चार, शेवरॉन में तीन या छह. अगर कोई सादी शेप साठ पॉइंट के साथ लौटी है, तो इंजन पिक्सल नॉइज़ का पीछा कर रहा था, और वह शेप धीरे रेंडर होगी, एडिट करने पर उलझेगी और स्केल करने पर हल्के से ग़लत दिखेगी.
Lite और ऊपर के प्लान पर डिटेल कंट्रोल इसे सीधे तौर पर तय करता है: कम डिटेल ज़्यादा ज़ोर से मर्ज करता है और कम, साफ़ नोड बनाता है. इसे उतना नीचे ले जाएँ जहाँ कोने बस हल्के से नरम होने लगें, फिर एक क़दम पीछे आ जाएँ. Free पर लेवल ऑटोमैटिक चुना जाता है, और उस पर असर डालने का रास्ता सोर्स की क्वालिटी है.
पिक्सल ग्रिड पर अलाइन करें बाद में, पहले नहीं
आइकॉन सेट की एक ग्रिड होती है — आमतौर पर 24×24 दो-पिक्सल सेफ़ मार्जिन के साथ, या सघन इंटरफ़ेस के लिए 16×16. ट्रेस किया हुआ पाथ वहीं पड़ता है जहाँ पिक्सल थे, जो उस ग्रिड के पास है पर उस पर नहीं, और छोटे रेंडर साइज़ पर यही 'पास' वह चीज़ है जिससे कतार में एक आइकॉन अपने पड़ोसियों से आधा पिक्सल भारी दिखता है.
तैयार पाथ को अपने एडिटर में पूर्ण कोऑर्डिनेट पर स्नैप करें और SVG का viewBox अपनी ग्रिड पर सेट करें. पहली बार यह बारीक काम है, बाद में यांत्रिक; और यही फ़र्क़ है ऐसे आइकॉन सेट में जो डिज़ाइन किया हुआ दिखता है और जो कन्वर्ट किया हुआ.
एक मोटाई, एक स्टाइल, एक फ़ाइल
अगर आप पूरा सेट दोबारा बना रहे हैं, तो सबको एक ही बैच में कन्वर्ट करें ताकि सब एक जैसी सेटिंग्स से गुज़रें, फिर पूरे सेट में स्ट्रोक की मोटाई हाथ से एक-सी करें. आइकॉन फ़ैमिली फ़ैमिली इसलिए लगती है कि उसके स्ट्रोक मेल खाते हैं; कई सेशनों में अलग-अलग ट्रेस किया सेट मेल नहीं खाएगा, और यह बेमेल तब भी दिखता है जब कोई एक भी आइकॉन अकेले में ग़लत न दिखे.
बैच कन्वर्ज़न Pro से शुरू होता है, जो एक बार में 30 फ़ाइलें लेता है. उससे नीचे फ़ाइलें एक-एक करके कन्वर्ट होती हैं, जो बीस के सेट के लिए रुकावट नहीं, कुछ मिनट के क्लिक हैं.
चरण दर चरण
- 01
सबसे बड़ा रैस्टर वर्ज़न लाएँ
512 पिक्सल या ज़्यादा, अगर मौजूद हो. 32-पिक्सल सोर्स ज़्यादातर एंटी-एलियासिंग होता है, और एंटी-एलियासिंग ही वह चीज़ है जिसमें इंजन चूकता है.
- 02
एक ही रंग में फ्लैट करें
कन्वर्ट करने से पहले ड्रॉप शैडो, इनर ग्लो और ग्रेडिएंट हटा दें. हर एक आउटपुट में अतिरिक्त शेप्स बन जाता है.
- 03
SVG में कन्वर्ट करें
अपलोड करें और नतीजा डाउनलोड करें. वेब और ऐप आइकॉन दोनों का नेटिव फ़ॉर्मैट SVG है.
- 04
नोड की संख्या जाँचें
पाथ को अपने एडिटर में खोलें. सादी शेप में कुछ ही पॉइंट होने चाहिए, दर्जनों नहीं. अगर दर्जनों हैं, तो सोर्स में नॉइज़ था.
- 05
अपनी आइकॉन ग्रिड पर स्नैप करें
पाथ को पूर्ण कोऑर्डिनेट पर अलाइन करें और viewBox को अपनी ग्रिड साइज़ पर सेट करें, ताकि आइकॉन 16 और 24 पिक्सल पर चुस्त रेंडर हो.
आम समस्याएँ
- आइकॉन 16 पिक्सल पर धुँधला दिखता है, भले ही वह वेक्टर है
- उसके पाथ पिक्सल ग्रिड पर अलाइन नहीं हैं, इसलिए रेंडरर हर किनारे पर एंटी-एलियासिंग कर रहा है. कोऑर्डिनेट को पूर्ण संख्याओं पर स्नैप करें और viewBox को अपनी ग्रिड के मुताबिक़ सेट करें.
- सादी शेप दर्जनों नोडों के साथ लौटी
- सोर्स में एंटी-एलियासिंग या JPEG नॉइज़ था जिसे इंजन डिटेल समझ गया. बड़ा, साफ़ सोर्स इस्तेमाल करें; Lite और ऊपर के प्लान पर डिटेल लेवल घटाएँ.
- कोने गोल हैं जो नुकीले होने चाहिए थे
- स्मूदिंग बहुत ज़्यादा है. Lite और ऊपर के प्लान पर इसे एक क़दम घटाएँ — असली कोने Strong तक नुकीले रहते हैं, और सिर्फ़ Maximum सब कुछ गोल करता है.
- आइकॉन के चारों ओर दूसरे रंग की महीन रेखा है
- वह ओरिजिनल की एंटी-एलियास्ड किनारी है, जो अपनी अलग पतली शेप के रूप में ट्रेस हुई. उसे एडिटर में हटाएँ, और अगली बार पहले सोर्स को एक ही सख़्त-किनारा रंग में फ्लैट करें.
अक्सर पूछे जाने वाले सवाल
- सोर्स आइकॉन का साइज़ कितना होना चाहिए?
- जितना बड़ा मौजूद हो — 512 पिक्सल या ज़्यादा आरामदायक है. लगभग 64 पिक्सल से नीचे एंटी-एलियासिंग इमेज का बड़ा हिस्सा बन जाती है और इंजन नरम किनारे को असली से अलग नहीं कर पाता, जिससे फूले हुए कर्व बनते हैं.
- क्या पूरा आइकॉन सेट एक साथ कन्वर्ट किया जा सकता है?
- बैच कन्वर्ज़न Pro से शुरू होता है, जो एक बार में 30 फ़ाइलें लेता है; Studio 50 और Agency 100. एक सेट को एक ही बैच में कन्वर्ट करना सिर्फ़ रफ़्तार से कहीं ज़्यादा मायने रखता है — हर फ़ाइल एक जैसी सेटिंग्स से गुज़रती है, इसलिए आइकॉन आपस में एक-से निकलते हैं.
- क्या ट्रांसपेरेंसी बची रहेगी?
- हाँ, अगर सोर्स में हो. PNG या WebP के पारदर्शी हिस्से SVG में ख़ाली ही रहते हैं. JPEG में ट्रांसपेरेंसी बिल्कुल नहीं होती, इसलिए JPEG से बना आइकॉन अपना बैकग्राउंड एक ठोस शेप के रूप में लेकर आता है, जिसे आप हटा सकते हैं.
- आइकॉन SVG में होने चाहिए या फ़ॉन्ट में?
- SVG में. आइकॉन फ़ॉन्ट उस ब्राउज़र दौर की ऊलझोल थे जो ख़त्म हो गया: वे कई रंग नहीं कर सकते, फ़ॉन्ट फ़ाइल ग़ायब होने पर टूट जाते हैं, और स्क्रीन रीडर उन्हें टेक्स्ट पढ़ते हैं. SVG में कन्वर्ट करें और उसे इनलाइन या स्प्राइट के रूप में इस्तेमाल करें.
संबंधित गाइड
- लोगो को वेक्टराइज़ कैसे करें — सिर्फ़ एक छोटी JPG के रूप में मौजूद लोगो को साफ़, प्रिंट-रेडी कर्व में दोबारा बनाएँ — बिल्कुल सही ब्रांड रंगों के साथ.
- ब्लूप्रिंट और टेक्निकल ड्रॉइंग को वेक्टराइज़ कैसे करें — स्कैन की हुई ड्रॉइंग और स्कीमैटिक को एडिट करने योग्य लाइन वर्क में बदलें — स्कैनर की ग़लतियाँ साथ लाए बिना.
- फ़्लायर या पोस्टर को लार्ज फ़ॉर्मैट के लिए वेक्टराइज़ कैसे करें — A1 और उससे बड़े साइज़ के लिए फ्लैट डिज़ाइन को बिना नरम किनारों के बचाएँ — और जानें कौन-से हिस्से कन्वर्ट नहीं करने हैं.