Generator favicon
Ubah gambar atau huruf menjadi satu set lengkap file favicon, beserta kode HTML untuk memakainya.
File Anda tidak pernah meninggalkan perangkat Anda
Letakkan gambar di sini
PNG, JPEG, WebP, GIF, BMP, atau AVIF. Atau beralih ke ikon huruf di bawah.
Dibuka di perangkat ini. Tidak ada yang diunggah.
Satu gambar sekaligus, hingga 50 MB dan sekitar 100 megapiksel. Ikon huruf memakai 1 atau 2 karakter.
Cara membuat favicon
- Pilih gambar, atau beralih ke Huruf dan ketik satu atau dua karakter dengan warna pilihan Anda.
- Untuk gambar, pilih potongan persegi di tengah atau muat dengan padding. Periksa pratinjau pada 16, 32, 48, dan 180 piksel.
- Tekan Buat file favicon, unduh .zip-nya, lalu tempel kode HTML ke halaman Anda.
Isi satu set favicon
Favicon adalah ikon kecil di tab browser, daftar bookmark, atau hasil pencarian, dan generator favicon ini membuat semua file yang dibutuhkan sekaligus. Browser mencari beberapa file yang berbeda: favicon.ico untuk penggunaan umum dan browser lama, ikon PNG 16 dan 32 piksel untuk tab, ikon Apple touch 180 piksel untuk layar utama iPhone dan iPad, serta ikon 192 dan 512 piksel untuk Android dan aplikasi web yang bisa diinstal. File kecil site.webmanifest mencantumkan ikon-ikon Android.
Alat ini menggambar setiap ukuran secara terpisah dari gambar asli Anda, jadi ukuran kecil diperkecil dari gambar penuh, bukan diperbesar dari gambar mungil. File .ico ditulis sebagai wadah berisi tiga gambar PNG pada 16, 32, dan 48 piksel. Ikon huruf digambar langsung pada setiap ukuran, sehingga tepinya tetap tajam.
Tips
- Gunakan bentuk yang tebal dan sederhana dengan kontras kuat. Detail halus akan hilang pada 16 piksel.
- Ingin gambar persegi dari sebagian foto? Gunakan Potong gambar dengan rasio 1:1 terlebih dahulu.
- Butuh ukuran lain? Ubah ukuran gambar bisa menghasilkan lebar dan tinggi berapa pun.
Pertanyaan umum
Apakah gambar saya diunggah?
Tidak. Ikon digambar di browser Anda, di perangkat Anda, dan file zip juga dibuat di sana. Tidak ada yang dikirim ke server.
File apa saja yang saya dapatkan?
favicon.ico (versi 16, 32, dan 48 piksel), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 piksel), android-chrome-192x192.png, android-chrome-512x512.png, dan site.webmanifest, dalam satu .zip.
Di mana saya meletakkan file-filenya?
Di folder root situs web Anda, sehingga file tersedia di alamat seperti /favicon.ico. Lalu tempel potongan HTML yang ditampilkan setelah Anda membuat file ke bagian head halaman Anda.
Gambar seperti apa yang sebaiknya saya pakai?
Gambar persegi minimal 512 × 512 piksel memberikan hasil paling bersih, karena ikon terbesar berukuran 512 piksel. Bentuk sederhana tetap terlihat jauh lebih baik saat diperkecil ke 16 piksel dibandingkan bentuk yang rumit. Periksa pratinjau 16 dan 32 piksel.
Apa bedanya memotong dan padding?
Memotong mengambil persegi di tengah gambar dan membuang sisanya. Muat dengan padding mempertahankan seluruh gambar, menempatkannya di tengah dengan margin kecil, lalu mengisi ruangnya dengan warna latar Anda atau membiarkannya transparan.
Apakah file .ico-nya valid?
Ya. File itu berisi tiga gambar berformat PNG pada 16, 32, dan 48 piksel, yang dapat dibaca semua browser saat ini.