Penukar Percuma

Favicon Penjana

Hasilkan fail favicon dalam berbilang saiz (16x16 hingga 512x512) daripada sebarang imej. Percuma, segera dan berjalan sepenuhnya dalam penyemak imbas anda.

Seret & Lepaskan imej di sini

Menyokong PNG, JPG, SVG, WebP. Maks 10MB.

Ataupun

Tentang alat ini

Favicon ialah ikon kecil yang muncul dalam tab penyemak imbas, penanda halaman dan senarai sejarah. Favicon asal — fail ICO 16×16 di /favicon.ico — telah berkembang menjadi set ikon yang kompleks pada saiz berbeza untuk platform berbeza: 16×16 dan 32×32 untuk tab penyemak imbas, 180×180 untuk skrin utama iOS, 192×192 dan 512×512 untuk pelbagai saiz untuk Android dan pelbagai saiz untuk Windows dan jubin pelbagai. Menghasilkan semua ini daripada imej sumber tunggal adalah perkara yang dilakukan oleh penjana favicon moden.

Alat ini mengambil satu imej sumber resolusi tinggi (biasanya logo segi empat sama) dan menjana set penuh aset favicon serta teg pautan HTML yang diperlukan untuk merujuknya. Output termasuk ICO, berbilang PNG dan manifest.json untuk metadata apl web progresif. Lepaskan fail yang terhasil pada akar tapak anda dan rujuknya melalui HTML yang dijana.

Semua pemprosesan berlaku dalam penyemak imbas anda. Tiada muat naik, tiada panggilan API, tiada had kadar. Output berfungsi pada setiap pelayar moden dan sistem pengendalian yang memaparkan favicon.

Mengapa Menjana Favicon

Tapak tanpa favicon kelihatan belum selesai. Tab penyemak imbas menunjukkan ikon generik; penanda buku tidak mempunyai pengecam visual; laman web kelihatan kurang profesional. Menambah set favicon yang betul ialah langkah menggilap berimpak tinggi dengan usaha rendah yang memberi isyarat perhatian kepada perincian.

Keperluan favicon moden telah berkembang melebihi /favicon.ico. Ikon skrin utama iOS, ikon Android Chrome, ikon jubin Windows dan varian mod gelap semuanya menggunakan fail yang berbeza. Menjana semuanya daripada satu sumber memastikan penjenamaan yang konsisten tanpa menguruskan setiap fail dengan tangan.

Cara menggunakan

Muat naik imej sumber, dapatkan set favicon penuh.

  1. Muat naik imej sumber: Gunakan imej segi empat sama sekurang-kurangnya 512×512 piksel. PNG diutamakan (sokongan ketelusan); SVG juga diterima. Sumber resolusi lebih tinggi menghasilkan ikon lebih kecil yang lebih tajam.
  2. Konfigurasikan pilihan platform: Dayakan output iOS, Android, Windows dan PWA mengikut keperluan. Tetapan lalai menghasilkan set standard yang diperlukan oleh kebanyakan tapak.
  3. Sesuaikan warna dan tema: Pilih warna tema untuk jubin Windows dan skrin percikan PWA. Padankan identiti jenama anda.
  4. Muat turun dan gunakan: Simpan zip yang dijana. Letakkan fail di akar tapak anda dan tambahkan teg pautan HTML yang dijana pada <head> anda. HTML merujuk setiap ikon pada saiz yang betul.

Kes Penggunaan Biasa

Butiran Teknikal

Set favicon moden penuh: favicon.ico (16+32+48 berbilang resolusi), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png, android-chrome-212.png, android-chrome-212 mstil-150x150.png. Selain site.webmanifest untuk PWA, browserconfig.xml untuk Windows.

Setiap PNG dijana oleh pensampelan turun berasaskan kanvas daripada sumber. ICO dibina dalam JavaScript dengan menggabungkan versi 16/32/48 ke dalam format ICO berbilang resolusi menggunakan penulisan DataView.

Teg pautan HTML merujuk setiap fail dengan atribut rel dan saiz yang sesuai. Penjana menghasilkan ini sebagai coretan sedia salin-tampal untuk <head> tapak anda.

Amalan Terbaik

Soalan lazim

Apakah format imej yang perlu saya muat naik?
PNG dengan latar belakang lutsinar berfungsi dengan baik. Gunakan imej segi empat sama sekurang-kurangnya 512x512 piksel supaya alat boleh mengecilkan tanpa kehilangan kualiti. SVG juga berfungsi dengan baik kerana ia berskala kepada sebarang saiz.
Apakah saiz yang dihasilkan ini?
16x16 (tab penyemak imbas), 32x32 (tab penyemak imbas @2x), 48x48 (bar tugas Windows), 180x180 (ikon Apple Touch), 192x192 (skrin utama Android), 512x512 (skrin percikan PWA). Fail ICO mengandungi saiz 16, 32 dan 48px.
Di manakah saya meletakkan fail favicon?
Letakkan favicon.ico dalam direktori akar tapak web anda. Saiz PNG lain dimasukkan ke dalam folder awam anda atau mana-mana laluan yang boleh diakses. Tambahkan teg pautan HTML dalam bahagian <head> anda yang menunjuk ke setiap lokasi fail.
Mengapa favicon saya tidak dikemas kini dalam penyemak imbas?
Penyemak imbas secara agresif cache favicon. Kosongkan cache penyemak imbas anda, cuba buka dalam tetingkap inkognito atau tambahkan rentetan pertanyaan versi (?v=2) pada URL favicon untuk memaksa muat semula.
Mengapa favicon saya tidak dikemas kini?
Penyemak imbas cache favicon secara agresif, kadangkala berhari-hari. Paksa muat semula dengan mengosongkan cache, membuka URL ikon secara terus atau menambahkan parameter pertanyaan versi pada teg pautan.
Adakah imej saya dimuat naik ke pelayan?
Tidak. Penjanaan berlaku dalam penyemak imbas anda.
Sekiranya saya menggunakan SVG atau PNG?
SVG untuk sumber (bebas resolusi). Penjana mengeluarkan PNG pada saiz tertentu; pelayar moden juga menyokong favicon SVG melalui pautan rel=icon type=image/svg+xml.
Apakah itu site.webmanifest?
Manifes JSON untuk apl web progresif yang menerangkan ikon, warna dan metadata lain. Diperlukan untuk apl web yang boleh dipasang; tidak berbahaya untuk disertakan walaupun pada tapak standard.