Favicon Generator
Ubah satu file PNG, JPG, atau SVG menjadi favicon.ico dan semua ukuran ikon yang dibutuhkan situs Anda, dikemas dalam format ZIP.
Seluruh gambar tetap terlihat, diposisikan di tengah dengan bantalan di sekelilingnya.
Latar belakang transparan sangat cocok untuk tab browser; untuk ikon layar utama iPhone, warna latar belakang lebih aman digunakan.
Favicon dan paket ikon Anda akan muncul di sini.
Letakkan file-file tersebut di folder root situs Anda, lalu tambahkan baris-baris kode ini ke setiap halaman.
Gambar Anda diubah menjadi ikon langsung di browser Anda. Tidak ada yang diunggah ke BroBroGo.
Tanya Jawab
File apa saja yang ada di dalam paket ikon?
File favicon.ico yang berisi versi 16, 32, dan 48 piksel di dalamnya, ikon PNG berukuran 16, 32, 180, 192, dan 512 piksel, serta file site.webmanifest yang mencantumkan ikon-ikon besar tersebut. Jika Anda memulai dari file SVG, file vektor itu sendiri juga akan disertakan. Satu file ZIP menampung semuanya.
Berapa ukuran gambar sumber yang sebaiknya saya gunakan?
Format SVG sangat ideal — setiap ikon digambar dari vektor, sehingga ukuran 16 piksel pun tetap tajam. Untuk PNG atau JPG, mulailah dari ukuran minimal 512 × 512; gambar yang lebih kecil akan diperbesar (upscaled) dan bisa terlihat buram.
Apakah latar belakang sebaiknya transparan atau berwarna?
Ikon tab terlihat bagus dengan latar belakang transparan. Namun, layar utama iPhone dan iPad akan mewarnai area transparan menjadi hitam — jika pengguna mungkin menambahkan situs Anda ke layar utama mereka, sebaiknya pilih warna latar belakang.
Apa yang terjadi pada gambar yang tidak berbentuk persegi?
Ikon berbentuk persegi, tetapi gambar Anda tidak akan pernah diregangkan secara paksa. Secara default, gambar akan diposisikan di tengah dengan bantalan (padding) di sekelilingnya; beralihlah ke opsi "Isi (potong)" untuk memotong tepi yang berlebih.
Di mana file-file tersebut harus diletakkan di situs saya?
Unggah file-file tersebut ke folder utama (root) situs Anda, sehingga favicon.ico dapat diakses di /favicon.ico, lalu tempelkan baris kode yang dihasilkan ke dalam tag <head> halaman Anda. Browser akan memilih ukuran yang tepat secara otomatis.