Lompat ke konten
SPCXTools

Pembuat Favicon

Ubah logo, huruf, atau emoji menjadi paket favicon lengkap beserta kode HTML untuk menggunakannya.

Berjalan secara lokal — file tidak pernah meninggalkan perangkat Anda

Memuat alat…

Cara menggunakan Pembuat Favicon

  1. 1Pilih Dari gambar dan pilih logo Anda (format PNG atau SVG persegi memberikan hasil terbaik), atau pilih Dari teks lalu ketik huruf, inisial, atau emoji.
  2. 2Sesuaikan radius sudut, padding, dan warna. Pratinjau akan menampilkan ikon dalam ukuran aslinya.
  3. 3Klik Unduh paket favicon untuk mendapatkan file ZIP berisi semua file.
  4. 4Unggah file ke root situs web Anda dan tempelkan cuplikan HTML ke dalam tag <head> di halaman Anda.

Buat favicon dalam hitungan detik

Favicon adalah ikon kecil yang muncul di tab browser, bookmark, riwayat, hasil pencarian di ponsel, dan di layar utama saat seseorang menyimpan situs Anda. Ikon ini membantu pengunjung menemukan tab Anda di antara puluhan tab lainnya dan membuat website kecil sekalipun terlihat profesional. Favicon generator ini membuat semua file yang Anda butuhkan dari satu gambar — atau dari huruf maupun emoji jika Anda belum punya logo — dan menyediakan kode HTML untuk ditambahkan ke situs Anda.

Fitur

  • Dari gambar: PNG, JPG, SVG, WebP, dan lainnya.
  • Dari teks atau emoji: inisial atau emoji dengan latar belakang warna.
  • Sudut melengkung dan padding agar ikon pas di tab dan layar utama.
  • Pratinjau langsung dalam ukuran 16, 32, 64, dan 128 piksel.
  • Paket lengkap: favicon.ico berbagai ukuran, ikon PNG, Apple touch icon, ikon Android, dan web manifest.
  • Tag link HTML yang siap disalin.
  • Privasi terjaga: diproses sepenuhnya di browser Anda.

Penjelasan ukuran favicon

File Ukuran Digunakan oleh
favicon.ico 16, 32, 48 px Semua browser, pintasan Windows, fallback sistem lama
favicon-16x16.png 16 px Tab browser
favicon-32x32.png 32 px Tab di layar high-DPI, taskbar
apple-touch-icon.png 180 px Layar utama iPhone dan iPad
android-chrome-192x192.png 192 px Layar utama Android
android-chrome-512x512.png 512 px Splash screen Android, instalasi PWA

Tips desain

  • Sederhanakan. Gunakan simbol logo Anda, bukan logo lengkap beserta nama perusahaan.
  • Gunakan kontras. Ikon harus menonjol baik pada tema browser terang maupun gelap.
  • Uji pada 16 px. Jika tidak bisa dikenali pada pratinjau terkecil, sederhanakan lagi.
  • Penuhi kotak. Ikon dengan banyak ruang kosong akan terlihat sangat kecil di tab; kurangi padding-nya.

Alat terkait

Konversi logo vektor ke PNG resolusi tinggi terlebih dahulu dengan SVG ke PNG, ubah ukuran gambar dengan Ubah Ukuran Gambar, atau ubah format gambar menggunakan Konverter Gambar.

Pertanyaan yang sering diajukan

File apa saja yang disertakan?
favicon.ico (16, 32, dan 48 px dalam satu file), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180 px), android-chrome-192x192.png, android-chrome-512x512.png, sebuah site.webmanifest, dan snippet HTML dengan tag link yang sesuai.
Gambar seperti apa yang terbaik untuk favicon?
Gambar persegi yang simpel dengan bentuk tebal dan sedikit detail. Favicon sering kali hanya ditampilkan dalam ukuran 16×16 piksel, sehingga teks dan garis tipis akan hilang. Ikon logo tanpa teks, atau satu huruf saja, jauh lebih bagus daripada logo lengkap. Gunakan gambar sumber dengan lebar minimal 512 px.
Di mana saya harus meletakkan filenya?
Unggah ke folder root website Anda agar dapat diakses di alamat seperti /favicon.ico. Kemudian tempelkan snippet HTML di dalam bagian <head>. Banyak browser juga otomatis mencari /favicon.ico meskipun tanpa tag tersebut.
Mengapa favicon baru saya tidak muncul?
Browser menyimpan cache favicon dengan sangat agresif. Buka alamat ikon secara langsung, lakukan force-refresh pada halaman, atau coba gunakan jendela privat. Pembaruan pada bookmark dan tab mungkin memakan waktu.
Perlukah menggunakan latar belakang transparan?
Transparansi terlihat bagus di tab browser, tetapi iOS akan mengisi area transparan pada Apple touch icon dengan warna hitam. Jika ikon Anda tidak terlihat bagus di latar belakang terang maupun gelap, matikan transparansi dan pilih warna latar belakang.
Apakah gambar saya diunggah?
Tidak. Semua ikon diproses dan dikemas langsung di browser Anda. Tidak ada yang dikirim ke server.

Alat terkait

SVG ke PNGUbah grafik vektor SVG menjadi gambar PNG tajam dalam ukuran apa pun, dengan transparansi yang tetap terjaga.Ubah Ukuran GambarUbah ukuran foto ke piksel yang tepat atau berdasarkan persentase — untuk satu gambar atau massal sekaligus, tanpa perlu diunggah.Konverter GambarUbah format foto dan grafis antara JPG, PNG, WebP, dan AVIF — secara massal, tanpa perlu upload.PNG ke WebPPerkecil ukuran gambar untuk website Anda dengan mengubah file PNG dan JPG ke WebP — langsung di browser Anda.Tambah Bingkai GambarTambahkan bingkai berwarna dan sudut melengkung yang bisa disesuaikan ke foto Anda dengan mudah.Tambah Teks ke GambarTambahkan keterangan, judul, atau teks meme pada gambar apa pun dan geser tepat ke posisi yang Anda inginkan.