Next.js के लिए फ़ेविकॉन
Next.js 14+ ऐप राउटर /app/icon.png और /app/favicon.ico को कन्वेंशन के रूप में मानता है - उन्हें छोड़ दें और नेक्स्ट स्वचालित रूप से सही टैग उत्सर्जित करता है।
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
favicon.ico को /ऐप के अंदर रखें और अगला इसे /favicon.ico पर परोसेगा और लिंक टैग इंजेक्ट करेगा।
बहु-आकार या थीम वाले आइकन के लिए, फ़ाइल कन्वेंशन का उपयोग करें: /app के अंदर आइकन.पीएनजी, आइकन.एसवीजी, ऐप्पल-आइकन.पीएनजी। अगला फ़ाइल मेटाडेटा से <लिंक> टैग उत्पन्न करता है।
यह कैसे काम करता है
- 1
favicon.ico उत्पन्न करें
512×512 स्रोत से बहु-आकार 16/32/48/64।
- 2
/ऐप में रखें
/app/favicon.ico स्वतः-सेवारत है। एचडी के लिए आइकन.पीएनजी जोड़ें।
- 3
सत्यापित करें
अपने ब्राउज़र में /favicon.ico खोलें - नेक्स्ट इसे बिना किसी कॉन्फिगरेशन के पेश करता है।
अभी आज़माएं
एक Next.js-तैयार फ़ेविकॉन जेनरेट करें
फ़ेविकॉन जनरेटरसामान्य प्रश्न
Next.js ऐप राउटर में आइकन कहां जाते हैं?+
/ऐप निर्देशिका के अंदर। फ़ाइल नाम (आइकन, ऐप्पल-आइकन, फ़ेविकॉन) भूमिका निर्धारित करता है।
पेज राउटर के बारे में क्या?+
favicon.ico को /public में डालें और इसे _document.tsx से लिंक करें।
क्या मुझे अब भी बहु-आकार .ico की आवश्यकता है?+
पुराने ब्राउज़र समर्थन के लिए अनुशंसित, विशेष रूप से Edge और IE-मोड शॉर्टकट।