Tukar PNG ke ICO (favicon)

Favicon ialah ikon kecil yang dipaparkan oleh pelayar pada tab, bar penanda buku dan sejarah. Alat ini menukar PNG kepada fail .ico yang betul dengan pelbagai saiz, iaitu versi 16, 32, 48 dan 64 piksel, semuanya dihasilkan pada peranti anda tanpa memuat naik apa-apa.

Cara menukar PNG ke ICO

Lepaskan imej PNG anda ke dalam alat di bawah. Imej segi empat sama memberikan hasil terbaik.
Format output sudah ditetapkan kepada ICO (favicon).
Klik Jalankan untuk menghasilkan .ico berbilang saiz.
Muat turun favicon.ico anda dan letakkan dalam folder akar laman web anda.

Apa yang perlu dilakukan oleh favicon

Favicon dipaparkan pada saiz yang sangat kecil, selalunya 16 piksel persegi. Pada saiz itu, butiran halus hilang dan garisan nipis lenyap sepenuhnya. Favicon yang baik ialah bentuk yang tebal, ringkas dan berkontras tinggi: satu huruf, versi ringkas tanda logo, atau bentuk padu dalam warna jenama. Jika logo penuh anda mengandungi teks, gunakan tandanya sahaja, atau huruf pertama sahaja.

Sebab fail .ico mengandungi beberapa saiz ialah membesarkan atau mengecilkan satu imej semasa paparan akan kelihatan kabur. Dengan menyediakan versi 16, 32, 48 dan 64 piksel, sistem pengendalian atau pelayar boleh memaparkan imej yang tepat piksel dalam setiap konteks: 16 px pada tab, 32 px dalam senarai penanda buku pada skrin DPI tinggi, 48 px pada pintasan bar tugas Windows, dan seterusnya.

Menyediakan PNG sumber

Pastikan ia segi empat sama. Jika logo anda lebar, letakkannya di atas kanvas segi empat sama yang lut sinar dahulu, atau pangkas kepada tandanya dengan alat pangkas.
Mulakan pada 256 piksel atau lebih. Mengecilkan daripada sumber yang besar dan bersih menghasilkan keputusan yang lebih licin berbanding membesarkan sumber yang kecil.
Kekalkan latar belakang lut sinar jika bentuknya padu, supaya ia kelihatan elok pada tema pelayar terang dan gelap. Jika bentuknya nipis atau berwarna pucat, letakkannya di atas segi empat sama berwarna padu.
Elakkan teks yang lebih panjang daripada satu atau dua huruf; ia tidak akan dapat dibaca pada 16 piksel.

Memasang favicon

Simpan fail yang dimuat turun sebagai favicon.ico dan letakkannya dalam folder akar laman web anda. Kemudian tambahkan kod ini di dalam <head> setiap halaman:

<link rel="icon" href="/favicon.ico" sizes="any">

Kebanyakan platform mempunyai tetapan khas sebagai gantinya: WordPress memanggilnya Site Icon di bawah Appearance, Shopify dan Squarespace mempunyai medan Favicon dalam tetapan tema, dan Webflow mempunyai satu dalam Project Settings. Muat naik .ico di situ. Untuk panduan lengkap, baca cara membuat favicon.

Melangkah lebih jauh

Untuk set ikon lengkap yang diminta oleh peranti moden, anda juga memerlukan PNG 180 piksel untuk pintasan skrin utama iOS (apple-touch-icon) dan PNG 192 serta 512 piksel untuk Android dan manifest aplikasi web. Ini ialah fail PNG biasa, jadi gunakan alat ubah saiz untuk menghasilkannya daripada salinan induk yang sama. Fail .ico daripada halaman ini meliputi tab pelayar, penanda buku dan Windows, iaitu tempat kebanyakan orang menyedari favicon yang tiada.

Soalan lazim

Berapakah saiz PNG asal saya yang sepatutnya?

Segi empat sama, dan sekurang-kurangnya 64 kali 64 piksel. PNG segi empat sama 256 piksel memberikan hasil paling bersih selepas dikecilkan. Imej yang bukan segi empat sama diletakkan di tengah dan ditambah ruang lutsinar.

Apakah kandungan fail .ico?

Empat imej yang dikod sebagai PNG pada 16, 32, 48 dan 64 piksel. Pelayar dan Windows memilih saiz yang paling sesuai untuk setiap situasi, jadi ikon kelihatan tajam pada tab, penanda buku dan pintasan desktop.

Bagaimanakah saya menambah favicon pada laman web saya?

Muat naik favicon.ico ke folder akar laman web anda (supaya ia tersedia di lamanwebanda.com/favicon.ico) dan tambah <link rel="icon" href="/favicon.ico"> di dalam <head> halaman anda. Pelayar menyimpan favicon dalam cache dengan kuat, jadi anda mungkin perlu memuat semula secara paksa untuk melihat perubahannya.

Adakah saya masih memerlukan fail .ico pada tahun 2026?

Pelayar moden menyokong favicon PNG dan SVG, tetapi .ico ialah satu-satunya format yang berfungsi di mana-mana, termasuk pelayar lama, pintasan Windows dan sesetengah pembaca suapan berita. Kebanyakan laman web menyediakan kedua-duanya.

Fail anda tidak pernah meninggalkan peranti anda

Setiap alat di Squishly Tools adalah 100% percuma dan berjalan sepenuhnya dalam pelayar anda. Imej dan dokumen anda diproses pada komputer anda sendiri dan tidak pernah dimuat naik ke pelayan. Tiada akaun, tiada tera air dan tiada helah.