Cara Membuat Favicon
Favicon modern lebih dari sekadar gambar berukuran 16×16. Berikut alur kerja lengkap untuk penyiapan yang terlihat tajam di setiap browser, OS, dan perangkat.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Apa itu favicon?
Favicon adalah ikon kecil yang ditampilkan browser di tab, bilah bookmark, dan daftar riwayat. Di perangkat seluler, ini adalah ikon layar beranda. Pada Windows itu adalah ikon pintasan.
Situs modern menghadirkan berbagai resolusi dan format sehingga setiap permukaan mendapatkan render yang tajam.
Siapkan gambar sumber Anda
Mulai dari gambar persegi berukuran minimal 512×512 — idealnya SVG dengan persegi viewBox. Apa pun yang lebih kecil akan kabur saat diperkecil.
Hindari garis tipis dan teks kecil. Mereka menghilang pada 16×16.
Hasilkan .ico multi-ukuran
Bundel 16, 32, 48, 64, 128, dan 256 dalam satu favicon.ico. Browser memilih ukuran yang tepat secara otomatis.
Generator favicon kami melakukan hal ini di sisi klien dalam waktu kurang dari satu detik.
Tambahkan tag HTML
Masukkan favicon.ico ke root situs Anda. Kemudian tambahkan ikon SVG, apple-touch-icon, dan manifes di <head> untuk penyiapan lengkap.
Verifikasi di setiap browser
Penyegaran paksa di Chrome, Safari, Firefox, dan Edge. Periksa bilah bookmark, tab, dan pemasangan layar beranda.
FAQ
What is a favicon?
A favicon is the small icon shown in browser tabs, bookmarks, and mobile home screens. Modern sites ship multiple sizes and formats for crisp rendering everywhere.
What size should my favicon source image be?
Start from a square image at least 512×512 pixels. SVG with a square viewBox works best for sharp downscaling.
Do I need both favicon.ico and PNG files?
Yes — ship a multi-size favicon.ico for universal fallback plus PNGs (180×180 and 192/512) for Apple, Android, and PWAs.
Where do I put favicon files on my website?
Place favicon.ico in your site root and add <link rel="icon"> tags in <head> for SVG and PNG variants.