Pembuat Favicon Real Gratis Online

Pembuat favicon gratis online. Unggah satu gambar dan unduh kit ikon lengkap — favicon.ico, ikon PNG, ikon sentuh Apple, dan web manifest — siap untuk tab browser, bookmark, dan layar utama Android dan iOS.

Gambar persegi berukuran 512 x 512 px atau lebih besar paling baik digunakan.

0%
Menyentuh tepiRuang bernapas
0%
PersegiLingkaran
Setelan aplikasi & pemasangan

Jalur relatif akar, seperti / atau /icons/.

#FFFFFF

Pilih gambar atau coba ikon teks untuk memulai.

512 PX
TAB BROWSER
Situs web saya
your-website.com
LAYAR UTAMA
Situs web saya
PIXEL SEMPURNA?

Bandingkan ukuran kecil.

16px
32px
48px
64px

Unduh kit ikon Anda

7 file ikon, web manifest, dan petunjuk pemasangan.

Di dalam unduhan Anda

9 file
favicon.icoClassic browser support
16, 32, 48 px
favicon-16x16.pngBrowser tabs
16 x 16
favicon-32x32.pngHigh-density tabs
32 x 32
favicon-48x48.pngSearch & shortcuts
48 x 48
apple-touch-icon.pngiPhone & iPad
180 x 180
android-chrome-192x192.pngAndroid home screen
192 x 192
android-chrome-512x512.pngLarge app icon
512 x 512
site.webmanifestWeb app metadata
JSON
INSTALL.txtInstallation guide
TXT

Kode HTML

HTML

Unggah file Anda, lalu tambahkan ini di dalam <head> situs Anda. Jalur diperbarui sesuai setelan Anda.

index.html
DARI UNGGAH KE MANA SAJA

Cara kerjanya

Lewati pengubahan ukuran manual dan menebak format.
Berangkat dari ide Anda hingga situs web yang mudah dikenali dalam tiga langkah.

01 /

Bawakan identitas Anda.

Unggah logo Anda atau buat ikon dari huruf. Bentuk sederhana, kontras kuat, dan kanvas persegi adalah titik awal terbaik.

02 /

Sempurnakan detailnya.

Pilih latar belakang, sesuaikan jarak, dan periksa pratinjau langsung. Pastikan tanda Anda tetap mudah dikenali bahkan di tab browser kecil.

03 /

Beri setiap tab rumah.

Unduh kit lengkap Anda, unggah file, dan tempel HTML. Merek Anda siap untuk tab browser, bookmark, dan layar utama.

DIRANCANG UNTUK HAL-HAL KECIL

Berfungsi di semua browser dan perangkat

Favicon sering menjadi bagian terkecil dari merek Anda. Namun seharusnya tetap terasa disengaja. Buat ukuran yang tepat untuk tempat orang menemukan, menyimpan, dan mengunjungi ulang situs Anda.

Buat favicon Anda
Browser sehari-hariICO + PNG untuk tab, bookmark, dan pintasan16-48 PX
Perangkat AppleIkon layar utama khusus dan buram180 PX
Aplikasi Android & webIkon resolusi tinggi dengan web manifest192 / 512
PANDUAN DUA MENIT

Pemasangan

Tanpa pengaturan yang rumit.
Hanya beberapa file di tempat yang tepat.

Langsung ke HTML Anda
1

Unduh dan ekstrak kit ikon Anda

Pilih sumber dan sesuaikan pratinjau, lalu pilih Unduh kit favicon. Ekstrak ZIP untuk mendapatkan tujuh file ikon, site.webmanifest, dan panduan pemasangan teks.

2

Letakkan file di tempat situs Anda dapat menyajikannya

Unggah ikon dan manifest ke root publik situs Anda. Jika ingin subfolder, tetapkan Direktori ikon di setelan aplikasi sebelum mengunduh. Contohnya, /icons/ berarti file Anda harus tersedia di your-site.com/icons/.

3

Tambahkan HTML dan periksa hasil Anda

Salin kode yang dibuat ke dalam <head> setiap halaman atau tata letak bersama Anda. Hapus tag ikon lama yang bertabrakan. Buka URL ikon secara langsung untuk memastikan dimuat, lalu kunjungi kembali situs Anda di jendela privat untuk menghindari ikon cache lama.

IKON YANG LEBIH BAIK DIMULAI DI SINI

Tips desain favicon

Lebih sedikit detail. Lebih banyak karakter.

Garis halus dan kata panjang menghilang pada ukuran kecil. Gunakan simbol khas, monogram, atau satu huruf alih-alih memaksakan seluruh logo ke dalam persegi.

Beri sedikit ruang.

Gunakan padding untuk menjaga tanda Anda jauh dari tepi. Tinjau tab browser dan layar utama: gambar yang sama bisa terasa sangat berbeda di setiap skala.

Manfaatkan kontras.

Ikon transparan bisa hilang dengan tema browser terang atau gelap. Latar belakang polos memberi kontras yang dapat diprediksi. Periksa kedua tema sebelum menayangkan.

Mulailah dengan sumber yang tajam.

Gambar besar dan bersih memberi generator lebih banyak detail. Memperbesar gambar kecil tidak dapat memulihkan informasi yang hilang. Gunakan SVG atau sumber 512 px bila memungkinkan.

DETAIL YANG LEBIH RUMIT

Pertanyaan yang sering diajukan

Segala hal lain yang mungkin ingin Anda ketahui tentang favicon baru Anda.

Apa itu favicon, dan mengapa saya membutuhkannya?

Favicon adalah ikon kecil yang mewakili situs Anda di tab browser, bookmark, riwayat, dan kadang hasil pencarian. Ikon yang jelas dan konsisten membantu pengunjung mengenali situs Anda di antara banyak tab terbuka. Ikon layar utama memiliki tujuan serupa ketika seseorang menyimpan situs Anda di ponsel.

Gambar apa yang harus saya unggah?

Mulailah dengan PNG, SVG, JPEG, atau WebP persegi, idealnya minimal 512 x 512 piksel. PNG transparan dan SVG mandiri bekerja sangat baik. Jaga desain tetap sederhana: simbol atau inisial biasanya lebih mudah terbaca daripada wordmark lengkap pada 16 piksel. File hingga 10 MB dan gambar hingga 4096 piksel per sisi didukung.

Apakah alat ini gratis? Apakah gambar saya diunggah?

Generator ini gratis digunakan, tanpa akun atau tanda air. Dekode gambar, pratinjau, dan pembuatan ZIP terjadi di browser Anda. Gambar sumber Anda tidak diunggah ke server. Browser Anda mungkin mengunduh aset situs saat kunjungan pertama, tetapi generator tidak mengirim gambar Anda ke mana pun.

Mengapa ikon Apple dan Android memiliki latar belakang?

Ikon layar utama paling baik di kanvas persegi polos. Alat ini meratakan hasil ekspor tersebut ke warna latar belakang yang Anda pilih, bahkan saat ikon browser transparan aktif. Perangkat menerapkan perlakuan sudutnya sendiri. Ekspor Android menggunakan tujuan standar "any"; keduanya bukan ikon maskable bersertifikat.

Mengapa favicon lama saya masih muncul?

Browser menyimpan favicon dalam cache secara agresif. Pertama periksa bahwa setiap URL yang dibuat terbuka langsung, dan halaman Anda hanya memiliki satu rangkaian tautan ikon yang disengaja. Lalu coba jendela privat atau bersihkan cache situs. Untuk pembaruan yang andal, gunakan folder baru seperti /icons-v2/ dan perbarui tautan HTML. Mesin pencari mungkin memerlukan waktu lebih lama untuk merayapi ulang ikon.

Apakah web manifest menjadikan situs saya PWA?

Tidak. Manifest menyediakan nama aplikasi, warna, dan ikon, tetapi tidak menambahkan fungsionalitas offline atau service worker. Kemampuan instal bergantung pada browser dan konfigurasi situs Anda, termasuk HTTPS. Manifest yang dibuat menggunakan / sebagai URL awal; edit jika aplikasi Anda berada di subdirektori.

Bisakah saya menggunakan file ini dengan WordPress, Shopify, atau Astro?

Ya. File-nya adalah gambar PNG dan ICO standar. Di Astro, letakkan di public/ dan tambahkan tag yang dibuat ke kepala tata letak bersama Anda. Untuk WordPress atau Shopify, gunakan setelan ikon situs platform bila memungkinkan, atau unggah file dan sesuaikan kepala tema Anda. Platform hosting mungkin mengontrol nama file dan URL, jadi sesuaikan jalurnya.