Pilih artwork kamu
Unggah SVG untuk ikon paling tajam dan favicon SVG, atau PNG, JPG, WebP, atau HEIC. Kalau sudah masuk, kamu bisa memilih salah satu hasilmu yang sudah dibuka.
Pembuat Favicon dan Ikon PWA
Satu unggahan, semua ikon yang dibutuhkan tab browser atau layar utama, plus tag yang mengarah ke ikon-ikon itu.
Buat set favicon-mu
SVG, PNG, JPG, WebP, HEIC · hingga 8 MB · gratis untuk file milikmu dan hasil yang sudah dibuka
Fungsi alat ini
Membuat semua ikon yang dibutuhkan situsmu dari satu gambar: favicon.ico, favicon PNG, favicon SVG (dari SVG), Apple touch icon dengan warna latarmu, dan ikon web app — termasuk ikon maskable yang tetap jelas saat ponsel memotongnya ke bentuknya sendiri. ZIP-nya juga berisi site.webmanifest dan favicon.html, tag yang tinggal kamu tempel ke halamanmu. PNG, JPG, WebP, atau HEIC mendapat semua ikon kecuali favicon SVG; alat ini tidak melakukan tracing gambar.
Demi keamanan, skrip, animasi, konten web yang disisipkan, tautan, dan apa pun yang memuat file lain akan dihapus; artwork kamu dan gambar PNG, JPEG, atau WebP yang disisipkan tetap ada. Hasilnya mencantumkan apa saja yang dihapus.
Input, output, dan batasan
Input
SVG, PNG, JPEG, WebP, atau HEIC
Output
ZIP berisi favicon.ico, favicon PNG, favicon SVG (dari sumber SVG), Apple touch icon, ikon PWA, site.webmanifest, dan tag HTML
Batasan
File hingga 8 MB; gambar PNG, JPG, dan WebP hingga 24 megapiksel, diskalakan ke 1.536 px sebelum diekspor. Alat ini membuat favicon.ico dengan gambar 16, 32, 48 px, favicon PNG 16 dan 32 px, Apple touch icon 180 px, dan ikon aplikasi 192 dan 512 px, masing-masing juga sebagai ikon maskable yang artwork-nya tetap di dalam zona aman (lingkaran di tengah, radiusnya 40% dari ukuran ikon). Batas pemrosesan: 30 dtk.
Cara kerjanya
Beri nama dan pilih warna
Nama dan nama pendek masuk ke web manifest. Warna tema adalah warna yang diberikan beberapa browser ke antarmukanya; warna latar mengisi Apple touch icon dan ikon maskable.
Unggah file-nya dan tempel tag-nya
Taruh semua file dari ZIP di folder yang kamu isi sebagai prefix path, lalu tempel tag dari favicon.html ke bagian head setiap halaman. README di dalam ZIP menjelaskan fungsi setiap file.
Pemecahan masalah
Kenapa tidak ada favicon.svg?
Favicon SVG hanya dibuat dari SVG yang seluruhnya berupa vektor. PNG, JPG, WebP, atau HEIC, atau SVG yang berisi gambar di dalamnya, mendapat favicon PNG dan ICO saja, dan hasilnya memberi tahu hal itu.
Ikon lama masih muncul
Browser menyimpan favicon di cache dalam waktu lama. Buka halaman di jendela pribadi (incognito), atau hapus data situsnya, untuk melihat file baru.
Logo saya terlihat kecil di ikon maskable
Launcher bisa memotong ikon maskable jadi lingkaran, jadi artwork-nya diskalakan agar muat di zona aman lingkaran. Kurangi padding untuk memperbesarnya; logo bulat bisa memenuhi seluruh lingkaran.
Apakah prefix path mengubah manifest?
Tidak. Path ikon di dalam site.webmanifest bersifat relatif terhadap manifest, jadi tetap berfungsi dari folder mana pun selama file-nya tetap bersama. Prefix mengatur path di favicon.html.
Akses dan harga
Alat ini tidak memakai kredit saat dipakai pada file yang kamu unggah atau hasil yang sudah kamu buka. File disimpan 24 jam untuk tamu dan 30 hari di akun. Lihat harga.