🌟

Favicon Generator — Buat Favicon Multi-Ukuran

Upload 1 gambar, dapatkan favicon dalam berbagai ukuran (16, 32, 48, 64, 128, 180, 192, 256, 512) plus kode HTML siap pakai.

Apa itu Favicon?

Favicon (favorite icon) adalah ikon kecil yang muncul di tab browser, bookmark, hasil pencarian, dan layar home ketika website disimpan sebagai shortcut. Meski ukurannya kecil, favicon berperan besar dalam branding dan kredibilitas website. Tab tanpa favicon terlihat generik dan kurang profesional.

Kenapa Butuh Banyak Ukuran?

Dulu cukup satu file favicon.ico 16x16 atau 32x32. Sekarang, dengan berbagai perangkat dan konteks penggunaan, favicon dibutuhkan dalam banyak ukuran:

  • 16x16, 32x32 — Tab browser desktop.
  • 48x48 — Windows tile.
  • 180x180 — Apple touch icon untuk iOS home screen.
  • 192x192, 512x512 — Android Chrome PWA icon, di-reference dari manifest.json.
  • 256x256 — Favicon resolusi tinggi untuk display retina.

Format File

PNG adalah format favicon paling umum sekarang karena support transparansi dan rendering crisp di berbagai ukuran. ICO masih dipakai untuk kompatibilitas browser lama (IE). SVG mulai didukung modern browser dan jadi favorit karena scalable dan dark-mode friendly. Tool ini menghasilkan PNG multi-ukuran yang cukup untuk 99% kebutuhan.

Cara Memasang Favicon

Setelah download favicon, letakkan di root folder website. Tambahkan tag <link> di <head> HTML. Tool ini sudah menghasilkan snippet HTML siap copy-paste untuk semua ukuran yang dihasilkan.

Tips Desain Favicon

  • Desain harus kerja di 16x16 px — sederhana, kontras tinggi, tanpa detail halus.
  • Hindari teks kecuali 1-2 huruf singkat. Teks panjang tidak terbaca di ukuran kecil.
  • Pakai bentuk geometris sederhana. Logo kompleks sebaiknya disederhanakan khusus untuk favicon.
  • Pertimbangkan background — favicon tanpa background bisa hilang di dark mode browser.
  • Test di mode terang dan gelap untuk memastikan terlihat jelas di kedua kondisi.

FAQ

Apakah file saya di-upload ke server?
Tidak. Semua proses terjadi di browser menggunakan Canvas API. Gambar Anda tidak meninggalkan komputer Anda.

Gambar input harus ukuran berapa?
Minimal 512x512. Idealnya square. Jika non-square, akan dicrop ke tengah.

Bagaimana dengan favicon.ico?
Kebanyakan browser modern sudah menerima PNG sebagai favicon. Untuk kompatibilitas penuh, Anda bisa convert favicon-32x32.png ke .ico dengan tool konversi terpisah.