Apa itu Generator Favicon Multi-Ukuran?

Unggah satu gambar — atau ketik 1 sampai 3 huruf atau sebuah emoji — dan dapatkan semua ukuran standar, dari ICO 16×16 hingga ikon App Store 1024×1024, plus favicon.svg yang dapat diskalakan. Termasuk Apple Touch, Android Chrome, MS Tile, dan tab pin Safari. Unduh satu per satu atau sekaligus sebagai ZIP.

Mulai dari logo Anda sendiri atau buat ikon cepat dari beberapa huruf atau sebuah emoji dengan warna dan font pilihan Anda. Generator menghasilkan 17 berkas PNG terpisah yang mencakup ukuran favicon klasik (16, 32, 48, 64, 96, 128, 256), ikon Apple Touch (152, 167, 180), ikon App Store 1024, Android Chrome (192, 384), MS Tile (144, 150, 310), dan PWA 512. Saring kisi berdasarkan platform, pilih bentuk keluaran persegi, sudut membulat, atau lingkaran, dan periksa favicon pada tab terang dan gelap sebelum mengunduh. Setiap ZIP juga menyertakan favicon.ico multi-resolusi, favicon.svg yang dapat diskalakan, cuplikan HTML siap tempel, dan manifest.json dengan maskable purpose pada ukuran Android; tambahkan nama aplikasi dan nama singkat agar bisa dipasang sebagai PWA.

Cara menggunakan

1. Unggah gambar persegi beresolusi tinggi (minimal 512×512px) sebagai sumber — atau beralih ke mode teks dan ketik 1 sampai 3 huruf atau sebuah emoji untuk membuatnya seketika.
2. Tinjau semua ukuran yang dihasilkan di grid. Aktifkan atau nonaktifkan sesuai platform yang Anda butuhkan.
3. Unduh ukuran satu per satu, ambil favicon.ico multi-resolusi sendiri, atau klik «Unduh Semua» untuk paket ZIP berisi semua ukuran terpilih, bundel ICO, cuplikan HTML, dan manifest.

Kapan menggunakan

• Meluncurkan situs baru dan butuh cakupan favicon di seluruh peramban dan OS.
• Rebranding: regenerasi semua ikon PWA dan layar utama dari logo baru.
• Menambahkan dukungan tambahkan ke layar utama agar Android merender ikon maskable dengan benar.

Hasil

Sebuah agensi web mengunggah logo baru klien untuk pembaruan merek. Mereka mendapatkan 12 ukuran untuk desktop, iOS Safari, Android Chrome, tile Windows, dan ikon manifest PWA, siap digunakan.

FAQ

Berapa ukuran ideal untuk gambar sumber?

Minimal 512x512 piksel, kotak, logo di tengah dengan sedikit jarak di sekitar. Jika lebih kecil, ikon PWA 512 akan buram saat diperbesar. Sumber vektor (SVG diraster ke PNG 1024) lebih baik lagi.

Mengapa ada favicon PNG dan ICO sekaligus?

Browser modern memanggil PNG di banyak ukuran lewat link rel='icon', dan makin condong ke satu favicon SVG yang dapat diskalakan. Berkas .ico masih dibutuhkan oleh browser Windows lama, beberapa platform hosting, dan sebagian alur situs yang disematkan. Generator ini menghasilkan ketiganya: PNG di semua ukuran modern, favicon.svg yang dapat diskalakan, plus favicon.ico yang menggabungkan bingkai 16, 32, dan 48px.

Apa itu ikon maskable dan kenapa Android perlu?

Android memotong ikon layar utama menjadi lingkaran, squircle, atau kotak melengkung tergantung peluncur. Ikon maskable punya zona aman di tengah (sekitar 80% kanvas) sehingga bagian penting logo tidak pernah terpotong. Tambah sekitar 10% padding di sekeliling sumber.

Di mana saya menaruh berkas hasil?

Letakkan setiap PNG di akar public situs (atau /static), tempel cuplikan HTML di head halaman, dan tautkan manifest.json. Apple Touch dan favicon ditaruh di head HTML; ikon PWA dirujuk oleh manifest.

Mengapa ada opsi latar belakang dan padding?

Logo transparan terlihat bagus di tab peramban tetapi terlihat aneh saat Android atau iOS menaruh kotak melengkungnya sendiri di belakang. Memadukan latar belakang solid dengan padding 8-12% memberi rendering ubin yang konsisten di tiap peluncur.

Alat terkait