PNG থেকে ICO-তে রূপান্তর করুন (ফেভিকন)
ফেভিকন হলো সেই ছোট আইকন যা ব্রাউজার ট্যাবে, বুকমার্ক বারে ও হিস্ট্রিতে দেখায়। এই টুল একটি PNG-কে 16, 32, 48 ও 64 পিক্সেলের সংস্করণসহ একাধিক সাইজের সঠিক .ico ফাইলে পরিণত করে, পুরোটাই আপনার ডিভাইসে, কোনো আপলোড ছাড়াই।
ফাইলগুলো এখানে ছেড়ে দিন অথবা ক্লিক করে বেছে নিন
ফলাফল
কীভাবে PNG থেকে ICO-তে রূপান্তর করবেন
- নিচের টুলে আপনার PNG ছবি ছেড়ে দিন। বর্গাকার ছবি সবচেয়ে ভালো কাজ করে।
- আউটপুট ফরম্যাট আগে থেকেই ICO (ফেভিকন) নির্বাচন করা আছে।
- একাধিক সাইজের .ico তৈরি করতে চালান বোতামে ক্লিক করুন।
- আপনার favicon.ico ডাউনলোড করে সাইটের রুট ফোল্ডারে রাখুন।
একটি favicon এর কী করা উচিত
favicon খুব ছোট আকারে দেখানো হয়, প্রায়ই 16 পিক্সেলের বর্গ। এই আকারে সূক্ষ্ম খুঁটিনাটি মিলিয়ে যায় আর সরু রেখা পুরোপুরি হারিয়ে যায়। ভালো favicon হলো মোটা, সরল, উচ্চ কনট্রাস্টের একটি আকৃতি: একটি অক্ষর, লোগো চিহ্নের সরলীকৃত রূপ, অথবা ব্র্যান্ডের রঙে একটি নিরেট আকৃতি। আপনার পূর্ণ লোগোতে লেখা থাকলে শুধু চিহ্নটি, বা শুধু প্রথম অক্ষরটি ব্যবহার করুন।
.ico ফাইলে একাধিক আকার থাকার কারণ হলো, দেখানোর সময় একটি মাত্র ছবিকে বড় বা ছোট করলে তা ঝাপসা দেখায়। 16, 32, 48 এবং 64 পিক্সেলের সংস্করণ দিলে অপারেটিং সিস্টেম বা ব্রাউজার প্রতিটি পরিস্থিতিতে পিক্সেল নিখুঁত ছবি দেখাতে পারে: ট্যাবে 16 px, উচ্চ DPI স্ক্রিনের বুকমার্ক তালিকায় 32 px, Windows টাস্কবারের শর্টকাটে 48 px, এভাবে চলতে থাকে।
মূল PNG প্রস্তুত করা
- এটিকে বর্গাকার করুন। আপনার লোগো চওড়া হলে আগে এটিকে একটি স্বচ্ছ বর্গাকার ক্যানভাসে বসান, অথবা ক্রপ টুল দিয়ে শুধু চিহ্নটুকু কেটে নিন।
- 256 পিক্সেল বা তার বেশি দিয়ে শুরু করুন। বড় ও পরিষ্কার মূল ছবি থেকে ছোট করলে ছোট ছবি বড় করার চেয়ে অনেক মসৃণ ফলাফল আসে।
- আকৃতিটি নিরেট হলে স্বচ্ছ ব্যাকগ্রাউন্ড রাখুন, যাতে ব্রাউজারের হালকা ও গাঢ় দুই থিমেই সুন্দর বসে। আকৃতিটি সরু বা হালকা রঙের হলে এর বদলে একটি এক রঙের বর্গের ওপর বসান।
- এক বা দুই অক্ষরের বেশি লেখা এড়িয়ে চলুন; 16 পিক্সেলে তা পড়া যাবে না।
favicon ইনস্টল করা
ডাউনলোড করা ফাইলটি favicon.ico নামে সেভ করুন এবং আপনার ওয়েবসাইটের মূল ফোল্ডারে রাখুন। তারপর প্রতিটি পৃষ্ঠার <head> এর ভেতরে এটি যোগ করুন:
<link rel="icon" href="/favicon.ico" sizes="any">
বেশিরভাগ প্ল্যাটফর্মে এর বদলে একটি নির্দিষ্ট সেটিং থাকে: WordPress এ এটি Appearance এর নিচে Site Icon নামে, Shopify আর Squarespace এ থিম সেটিংসে একটি Favicon অংশ আছে, আর Webflow এ এটি Project Settings এ। .ico ফাইলটি সেখানে আপলোড করুন। পূর্ণাঙ্গ নির্দেশনার জন্য পড়ুন কীভাবে favicon বানাবেন।
আরও এক ধাপ এগিয়ে
আধুনিক ডিভাইস যে পূর্ণ আইকন সেট চায়, তার জন্য আপনার আরও লাগবে iOS হোম স্ক্রিন শর্টকাটের জন্য 180 পিক্সেলের একটি PNG (apple-touch-icon) এবং Android ও ওয়েব অ্যাপ ম্যানিফেস্টের জন্য 192 ও 512 পিক্সেলের PNG। এগুলো সাধারণ PNG ফাইল, তাই একই মূল কপি থেকে এগুলো বানাতে রিসাইজ টুল ব্যবহার করুন। এই পৃষ্ঠার .ico ফাইলটি ব্রাউজারের ট্যাব, বুকমার্ক আর Windows সামলায়, যেখানে বেশিরভাগ মানুষ favicon না থাকাটা লক্ষ করেন।
সচরাচর জিজ্ঞাসিত প্রশ্ন
আমার মূল PNG কত বড় হওয়া উচিত?
বর্গাকার, এবং কমপক্ষে 64 x 64 পিক্সেল। 256 পিক্সেলের বর্গাকার PNG ছোট করার পর সবচেয়ে পরিষ্কার ফল দেয়। বর্গাকার নয় এমন ছবি মাঝখানে বসিয়ে চারপাশে স্বচ্ছ জায়গা যোগ করা হয়।
.ico ফাইলের ভেতরে কী থাকে?
16, 32, 48 ও 64 পিক্সেলের চারটি PNG এনকোড করা ছবি। ব্রাউজার ও Windows প্রেক্ষাপট অনুযায়ী সবচেয়ে মানানসই সাইজটি বেছে নেয়, তাই ট্যাব, বুকমার্ক ও ডেস্কটপ শর্টকাটে আইকনটি তীক্ষ্ণ দেখায়।
আমার ওয়েবসাইটে ফেভিকন কীভাবে যোগ করব?
favicon.ico আপনার সাইটের রুট ফোল্ডারে আপলোড করুন (যাতে এটি yoursite.com/favicon.ico ঠিকানায় পাওয়া যায়) এবং আপনার পাতাগুলোর <head>-এর ভেতরে <link rel="icon" href="/favicon.ico"> যোগ করুন। ব্রাউজার ফেভিকন জোরালোভাবে ক্যাশে রাখে, তাই পরিবর্তন দেখতে হার্ড রিফ্রেশ লাগতে পারে।
2026 সালে কি এখনো .ico ফাইল দরকার?
আধুনিক ব্রাউজার PNG ও SVG ফেভিকন গ্রহণ করে, তবে .ico-ই একমাত্র ফরম্যাট যা সব জায়গায় চলে, পুরোনো ব্রাউজার, Windows শর্টকাট ও কিছু ফিড রিডারসহ। বেশিরভাগ সাইট দুটোই রাখে।
আপনার ফাইল কখনো আপনার ডিভাইস ছেড়ে যায় না
Squishly Tools-এর প্রতিটি টুল 100% বিনামূল্যে এবং পুরোপুরি আপনার ব্রাউজারের ভেতরে চলে। আপনার ছবি ও ডকুমেন্ট আপনার নিজের কম্পিউটারেই প্রসেস হয় এবং কখনো কোনো সার্ভারে আপলোড হয় না। কোনো অ্যাকাউন্ট নেই, ওয়াটারমার্ক নেই, কোনো লুকানো শর্তও নেই।