গাইড

React এর জন্য ফেভিকন

React আপনার জন্য <head> রেন্ডার করে না — ফ্যাভিকন index.html এ থাকে। আপনার favicon.ico/পাবলিক-এ ড্রপ করুন এবং লিঙ্ক করুন; আধুনিক সেটআপগুলি একটি SVG এবং PNG ভেরিয়েন্টও পাঠায়।

Check favicons on any website

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

Install Chrome Extension

Vite এবং CRA উভয়ই রুটে/পাবলিক পরিবেশন করে, তাই /favicon.ico হল ডিফল্ট আবিষ্কারের পথ। কোন বান্ডলার কনফিগার প্রয়োজন নেই.

হাই-ডিপিআই ডিসপ্লে এবং 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>@media (prefers-color-scheme: dark) {...}</style> ব্লক সহ একটি একক SVG ব্যবহার করুন।

কেন আমার ফেভিকন dev এ লোড হবে না?+

ট্যাবটি হার্ড-রিফ্রেশ করুন। ব্রাউজার ক্যাশে /favicon.ico প্রতি-অরিজিন এমনকি রিলোড জুড়ে।

সম্পর্কিত টুলস

আরও গাইড

গাইড