गाइड

React के लिए फ़ेविकॉन

React आपके लिए <head> प्रस्तुत नहीं करता है - फ़ेविकॉन Index.html में रहता है। अपना favicon.ico /public में डालें और लिंक करें; आधुनिक सेटअप SVG और PNG वैरिएंट भी शिप करते हैं।

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

Vite और CRA दोनों रूट पर /public की सेवा करते हैं, इसलिए /favicon.ico डिफ़ॉल्ट खोज पथ है। किसी बंडलर कॉन्फ़िगरेशन की आवश्यकता नहीं है.

उच्च-DPI डिस्प्ले और PWA इंस्टाल संकेतों के लिए, एक 180×180 apple-touch-icon और एक 512×512 PNG को /public में जोड़ें और उन्हें Index.html में लिंक करें।

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

  1. 1

    एक बहु-आकार .ico उत्पन्न करें

    512×512 स्रोत के साथ हमारे फ़ेविकॉन जनरेटर का उपयोग करें।

  2. 2

    /सार्वजनिक में छोड़ें

    वहां favicon.ico, favicon.svg, और apple-touch-icon.png रखें।

  3. 3

    Index.html में लिंक करें

    <link rel='icon' href='/favicon.ico'> और <link rel='icon' type='image/svg+xml' href='/favicon.svg'> जोड़ें।

अभी आज़माएं

एक React-तैयार फ़ेविकॉन बनाएं

फ़ेविकॉन जनरेटर

सामान्य प्रश्न

Vite React ऐप में फ़ेविकॉन कहाँ जाता है?+

/public/favicon.ico (और /public/favicon.svg यदि आप वेक्टर संस्करण चाहते हैं)।

मैं डार्क-मोड फ़ेविकॉन कैसे जोड़ूँ?+

<style>@मीडिया (पसंद-रंग-योजना: गहरा) {...}</style> ब्लॉक के साथ एकल SVG का उपयोग करें।

मेरा फ़ेविकॉन देव में लोड क्यों नहीं होगा?+

टैब को हार्ड-रीफ्रेश करें। पुनः लोड करने पर भी ब्राउज़र कैश /favicon.ico प्रति-उत्पत्ति।

संबंधित उपकरण

अधिक गाइड

गाइड