मुफ़्त फ़ेविकॉन जेनरेटर

यह कैसे काम करता है

यह टूल किसी भी PNG, JPEG, WebP, या SVG को Canvas API और JSZip का उपयोग करके पूरी तरह आपके ब्राउज़र के अंदर एक पूर्ण फ़ेविकॉन पैकेज — मल्टी-साइज़ .ico, Apple touch icon, Android/PWA icons, एक वेब मैनिफ़ेस्ट, और एक पेस्ट-रेडी HTML स्निपेट — में बदल देता है। कुछ भी अपलोड नहीं होता; सारी रेंडरिंग और फ़ाइल असेंबली स्थानीय रूप से होती है।

1. 1
   Canvas आपकी इमेज को फिर से स्केल करता है

   ब्राउज़र आपकी स्रोत इमेज को हर आवश्यक साइज़ (16, 32, 48, 180, 192, और 512 px) पर off-screen HTML Canvas एलिमेंट पर खींचता है। स्पष्ट width/height एट्रिब्यूट के बिना SVG पहले DOMParser और XMLSerializer के ज़रिए नॉर्मलाइज़ किए जाते हैं ताकि Firefox और Chrome एक खाली कैनवस की बजाय समान पिक्सेल आउटपुट बनाएँ।
2. 2
   हाथ से लिखा ICO एनकोडर .ico फ़ाइल को पैक करता है

   छोटी ICO एंट्री (16, 32, 48 px) रॉ 32-बिट BGRA DIB बिटमैप के रूप में एनकोड की जाती हैं — BITMAPINFOHEADER प्लस bottom-up XOR rows और एक 1bpp AND मास्क — क्योंकि Windows shell कंपोनेंटों को उन साइज़ पर uncompressed DIB फ़ॉर्मेट चाहिए। टूल ICO डायरेक्टरी हेडर लिखता है और DataView और Uint8Array के साथ पूरी तरह एंट्री जोड़ता है, कोई बाहरी ICO लाइब्रेरी शामिल नहीं।
3. 3
   PNG आउटपुट canvas.toBlob के ज़रिए बनाए जाते हैं

   हर PNG वेरिएंट (favicon-16x16, favicon-32x32, apple-touch-icon-180x180, android-chrome-192x192, android-chrome-512x512) canvas.toBlob को 'image/png' के साथ कॉल करके कैप्चर किया जाता है, लॉसलेस एनकोडिंग को ब्राउज़र के बिल्ट-इन इमेज इंजन को सौंपते हुए। वैकल्पिक पैडिंग, बैकग्राउंड कलर, और शेप क्लिपिंग (square, rounded, या circle) कैप्चर से पहले कैनवस कॉन्टेक्स्ट पर लागू की जाती हैं।
4. 4
   JSZip सब कुछ एक डाउनलोड में बंडल करता है

   JSZip सभी जनरेट की गई फ़ाइलों — favicon.ico, पाँच PNGs, आपके ऐप नाम के साथ site.webmanifest, और सही <link> टैग के साथ favicon-snippet.html — को एक सिंगल .zip blob में असेंबल करता है जो अपने आप आपके डिवाइस पर डाउनलोड होता है।

संबंधित टूल