Cara Menambahkan Favicon ke HTML
Menambahkan favicon ke halaman HTML biasa adalah perubahan satu baris — tetapi pengaturan modern dan lengkap terdiri dari enam baris dan mencakup instalasi iOS, Android, mode gelap, dan PWA.
Check favicons on any website
Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.
Tag tunggal yang dihormati oleh setiap browser adalah <link rel="icon" href="/favicon.ico">. Letakkan favicon.ico di root situs Anda dan 80% selesai.
20% sisanya — varian apple-touch-icon, PNG, SVG dengan dukungan mode gelap, dan manifes web — inilah yang membedakan ikon default dari pengalaman merek yang disempurnakan.
Cara kerjanya
- 1
Hasilkan paket favicon Anda
Gunakan generator paket FetchFavicon — menghasilkan setiap file yang Anda perlukan ditambah markup siap tempel.
- 2
Letakkan file di root situs
favicon.ico, apple-touch-icon.png, android-chrome-192/512.png, situs.webmanifest.
- 3
Tempel cuplikan ke <head>
Enam tag <link> + satu <meta name="theme-color">.
Coba sekarang
Dapatkan cuplikan HTML
Pembuat FaviconFAQ
Kemana perginya tag <link>?+
Di dalam <head>, di mana saja — pesanan tidak menjadi masalah selama pesanan datang sebelum </head>.
Apakah saya memerlukan .ico dan PNG?+
Ya. .ico adalah pengganti universal; PNG menghasilkan tampilan paling tajam pada layar DPI tinggi.
Bagaimana dengan mode gelap?+
Kirimkan varian SVG yang menyematkan kueri media skema warna pilihan di dalam blok <style>-nya.
Alat terkait
Pembuat Favicon
Hasilkan paket favicon lengkap (ICO + PNG) untuk setiap perangkat dan browser.
Konverter PNG ke ICO
Konverter PNG ke ICO online gratis untuk ikon Windows, ikon aplikasi, dan favicon situs web.
Pemeriksa favicon
Periksa favicon situs mana pun — validasi ukuran, format, dan varian yang hilang.