Cara Membuat Favicon untuk Situs Web Anda dalam Hitungan Menit
Untuk membuat favicon, unggah logo persegi Anda dalam format PNG, JPG, atau GIF ke Generator Favicon di pdfseotools.com. Unggah PNG untuk mendapatkan ikon PNG. Anda akan mendapatkan ZIP berisi 17 ukuran ikon untuk browser, iPhone, Android, dan Windows. Unggah file ke root situs Anda dan tambahkan tag tautan ke bagian head halaman Anda.

Fakta Penting
- Input: PNG, JPG, atau GIF – format persegi paling baik
- Output: 17 ukuran dalam satu ZIP, dalam format yang Anda unggah (PNG direkomendasikan)
- Mencakup browser (16–96 px), Apple (57–180 px), Android (36–192 px), ubin Windows (70–310 px)
- Google memerlukan minimal 48 × 48 px agar dapat menampilkannya di hasil pencarian
Mengapa favicon penting
✓🖼️ Favicon adalah ikon kecil di tab browser, bookmark, layar beranda ponsel, dan – semakin banyak – di samping nama situs Anda di hasil Google. Ikon yang jelas memudahkan situs Anda ditemukan di antara dua puluh tab yang terbuka dan terlihat lebih terpercaya di hasil pencarian.
Cara membuat favicon Anda – langkah demi langkah

Langkah 1: Siapkan gambar persegi
Gunakan simbol logo Anda dengan latar belakang polos, minimal 310 × 310 piksel. Hapus teks kecil – teks tersebut menjadi tidak terbaca pada ukuran 16 piksel.
Langkah 2: Unggah
Buka Generator Favicon dan pilih gambar Anda – PNG adalah yang terbaik, karena ikon disimpan dalam format yang sama saat Anda mengunggahnya.
Langkah 3: Hasilkan
Alat ini membuat semua 17 ukuran sekaligus.
Langkah 4: Unduh ZIP
Ekstrak di komputer Anda – Anda akan mengunggah file-file ini ke situs web Anda selanjutnya.
Tambahkan ke situs web Anda
✓Unggah file PNG ke folder root situs Anda (folder dengan beranda Anda), lalu tambahkan baris-baris ini di dalam <head> halaman Anda:
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png">
WordPress: buka Appearance → Customize → Site Identity → Site Icon dan unggah gambar 512 × 512 – WordPress akan menambahkan tag untuk Anda. Blogger: Layout → Favicon → Edit.
Tips desain untuk ukuran kecil
- Gunakan satu bentuk atau huruf yang tebal – detail halus akan hilang pada ukuran 16 px.
- Pilih kontras yang kuat agar berfungsi baik di tab browser terang maupun gelap.
- Hindari garis tipis dan kata-kata panjang.
- Pratinjau dalam ukuran kecil: perkecil tampilan browser Anda dan lihat tabnya.
Buka Generator Favicon di pdfseotools.com – gratis, tanpa pendaftaran, dan berfungsi di perangkat apa pun.
Pertanyaan yang Sering Diajukan
Gambar apa yang harus saya unggah?
PNG, JPG, atau GIF persegi dari logo atau ikon Anda, idealnya minimal 310 × 310 piksel dan cukup sederhana untuk dikenali pada ukuran kecil.
Ukuran apa saja yang dibuat oleh generator?
17 ukuran, disimpan dalam format yang sama dengan yang Anda unggah (unggah PNG untuk mendapatkan ikon PNG): favicon browser 16, 32, dan 96 piksel; ikon sentuh Apple dari 57 hingga 180 piksel; ikon Android pada 36, 48, dan 192 piksel; dan ubin Microsoft pada 70, 144, 150, dan 310 piksel. Semuanya diunduh bersama sebagai ZIP.
Mengapa favicon baru saya tidak muncul?
Browser sangat sering menyimpan cache favicon. Hapus cache browser atau buka situs di jendela pribadi. Hasil pencarian Google dapat memerlukan waktu berhari-hari atau berminggu-minggu untuk diperbarui.
Apakah Google menampilkan favicon saya di hasil penelusuran?
Google dapat menampilkannya di samping nama situs Anda. Ini memerlukan ikon persegi minimal 48 × 48 piksel yang dapat diakses oleh crawler.
Bisakah saya menggunakan logo yang tidak persegi?
Generator mengubah ukuran menjadi persegi, sehingga logo yang lebar menjadi gepeng. Pangkas versi persegi – biasanya hanya simbolnya – terlebih dahulu.
Apakah saya memerlukan file favicon.ico?
Browser modern menerima favicon PNG yang ditautkan di HTML Anda, yang dihasilkan oleh generator ini. Beberapa pemilik situs juga menambahkan favicon.ico di root untuk browser lama.
Ringkasan
Logo persegi masuk, 17 ukuran keluar, beberapa baris di HTML Anda – dan situs Anda mendapatkan ikon profesional di mana-mana. Buat milik Anda dengan Generator Favicon dan jelajahi lebih banyak alat gambar gratis.
Bagikan di Media Sosial: