Favicon dan manifes web

Satu gambar masuk, satu set penuh keluar: ICO sungguhan dengan banyak ukuran, ikon sentuh Apple yang diratakan sesuai maunya Apple, PNG untuk manifes, manifes webnya sendiri, dan blok HTML untuk ditempel. Ia juga menunjukkan pemotongan maskable Android sebelum pemotongan itu menggigit — di situlah kebanyakan ikon diam-diam kehilangan tepinya.

Letakkan gambar di sini atau klik untuk memilih
Paling baik yang persegi, minimal 512 piksel. PNG transparan memberi hasil paling bersih.
Yang muat di bawah ikon pada layar utama.
Mengisi transparansi di tempat yang tidak mengizinkannya, dan jadi bantalan untuk ikon maskable.
BerkasUkuranYang memakainya
 

    


    

    

      
Kenapa .ico masih penting

      
Satu PNG saja sudah cukup untuk kebanyakan peramban, dan kalau yang Anda perlukan hanyalah ikon tab, Anda bisa berhenti di situ. ICO layak mendapat tempatnya karena menyimpan beberapa resolusi dalam satu berkas dan sistem operasilah yang memilih yang tepat: tab memakai yang 16, pintasan yang disematkan atau tautan di desktop memakai yang 32 atau 48, dan masing-masing digambar dari bitmap yang dibuat untuk ukuran itu, bukan diperas seketika dari yang besar. Berkas yang dihasilkan di sini adalah wadah berisi PNG dengan sedikit header, dan itulah yang dibaca setiap peramban yang terbit di abad ini.

      
Zona aman maskable

      
Android tidak menjanjikan ikon Anda akan tampil sebagai persegi. Tergantung launcher-nya, ia bisa memotongnya jadi lingkaran, squircle, atau persegi bersudut membulat, dan yang dijamin hanyalah lingkaran dalamnya — delapan puluh persen dari lebarnya, di tengah. Karya yang menjangkau tepi justru karya yang kehilangan tepinya. Perbaikannya adalah memberi bantalan pada ikon manifes hingga masuk zona aman itu, dan pratinjau di sini menggambar potongannya supaya Anda melihatnya sebelum pengguna melihatnya.

      
Kenapa ikon sentuh Apple tidak punya transparansi

      
iOS menyusun ikon layar utama di atas bentuk membulatnya sendiri dan tidak menghormati kanal alfa seperti yang Anda harapkan; area transparan keluar jadi hitam. Karena itu berkas yang satu itu diratakan ke atas warna latar Anda sebelum dikodekan, sementara PNG manifes tetap membawa alfanya, tempat alfa ditangani dengan benar.

      
Apa yang harus dilakukan dengan berkasnya

      
Taruh semuanya di akar situs, bukan di folder aset — peramban dan perayap menebak jalur favicon dan sebagian akan mengambilnya entah Anda menautkannya atau tidak. Lalu tempelkan blok HTML ke bagian head halaman Anda. Jalur manifes adalah satu-satunya baris yang harus cocok dengan tempat Anda benar-benar menaruh berkasnya.


      
Pertanyaan Umum

      

        
Apa saya masih perlu favicon.ico kalau sudah punya PNG?
Kalau ketat, tidak. Kalau praktis, ya: banyak perayap, pembaca feed, dan perkakas lawas meminta favicon lewat jalurnya dan tidak pernah melihat markah Anda. Biayanya beberapa kilobyte.

        
Ikon saya terlihat buram di 16 piksel. Apa yang bisa saya lakukan?
Tidak ada yang bisa memperbaikinya di sini, karena ruangnya memang tidak cukup. Pada ukuran itu sebuah tanda hanya punya sekitar sepuluh piksel yang terbaca melintang; logotipe selalu berubah jadi bubur. Kirimkan versi yang disederhanakan — satu bentuk, satu huruf — sebagai sumbernya, dan simpan kunci logo lengkapnya untuk tempat lain.

        
Perlukah saya matikan bantalan maskable-nya?
Hanya kalau karya Anda memang sudah duduk di dalam marginnya sendiri yang lapang. Kalau ia memenuhi bingkai, biarkan menyala, atau Android akan memotong ke dalamnya.

        
Apakah gambar saya diunggah ke suatu tempat?
Tidak. Setiap ukuran digambar pada kanvas di halaman ini dan arsipnya dirakit di memori. Tidak ada yang dikirim.

      

      
Dibuat oleh tim GO AI. Pembuat ikon aplikasi · Pengubah ukuran massal · Semua alat gratis