Skip to content

Konverter PNG ke ICO (dan ICO ke PNG)

Ubah PNG, JPG, SVG, atau WebP menjadi .ico multi-ukuran — 16, 32, dan 48 px dalam satu file, dengan alfa utuh. Pilih penyimpanan PNG atau bitmap tanpa kompresi dan lihat kedua ukurannya. Bisa juga membuka kembali file .ico.

Tanpa Pelacakan Berjalan di Browser Gratis
Konversi berjalan sepenuhnya di browser Anda. Gambar Anda tidak pernah diunggah.

Lepas gambar di sini atau klik untuk memilih

PNG, JPG, SVG, WebP, GIF, atau BMP · hingga 10 MB

Ukuran yang dikemas

16, 32, dan 48 px adalah yang diminta panduan ikon Microsoft 1995 sekaligus kombinasi yang paling sering muncul pada favicon nyata. 512 tidak ditawarkan: direktori menyimpan panjang sisi dalam satu byte, jadi tidak ada representasi yang sah untuknya.

Keduanya sah di dalam .ico. PNG sudah dibaca Windows sejak Vista dan oleh setiap browser saat ini; bitmap tanpa kompresi adalah yang sebenarnya dipakai 13 dari 14 file ICO asli yang ditemukan di 20 situs yang disampel, karena ImageMagick mengubahnya ke sana secara bawaan.

Apa yang ada di dalam file .ico (contoh 16 + 32 + 48 px)
Offset Byte Medan Nilai
0 2 idReserved 0
2 2 idType 1
4 2 idCount 3
6 1 bWidth[0] 16 → 16
7 1 bHeight[0] 16 → 16
8 1 bColorCount[0] 0
9 1 bReserved[0] 0
10 2 wPlanes[0] 1
12 2 wBitCount[0] 32
14 4 dwBytesInRes[0] 248
18 4 dwImageOffset[0] 54
22 1 bWidth[1] 32 → 32
23 1 bHeight[1] 32 → 32
24 1 bColorCount[1] 0
25 1 bReserved[1] 0
26 2 wPlanes[1] 1
28 2 wBitCount[1] 32
30 4 dwBytesInRes[1] 720
34 4 dwImageOffset[1] 302
38 1 bWidth[2] 48 → 48
39 1 bHeight[2] 48 → 48
40 1 bColorCount[2] 0
41 1 bReserved[2] 0
42 2 wPlanes[2] 1
44 2 wBitCount[2] 32
46 4 dwBytesInRes[2] 1464
50 4 dwImageOffset[2] 1022
Hex dump, jumlah byte, dan keluaran perintah yang dikutip di halaman ini diambil dari file yang dihasilkan alat ini sendiri, dan setiap klaim tentang perilaku dekoder diperiksa silang terhadap tiga implementasi independen: encoder yang ditulis dari nol, Pillow 12.3.0, dan dekoder ICO milik Chromium. Pengamatan bahwa kebanyakan favicon yang beredar memakai bitmap tanpa kompresi berasal dari mengambil dan mengurai file ikon dua puluh situs terkenal pada September 2026. — Go Tools Engineering Team · Sep 22, 2026

Ditulis dan ditinjau oleh para pengembang yang membangun utilitas konversi Go Tools. Tata letak kontainer, jumlah byte, dan mode kegagalan yang dijelaskan di sini berasal dari tinjauan domain tertulis, bukan dari ringkasan orang lain tentang format ini.

Jawaban singkat PNG ke ICO

Ukuran apa saja yang sebaiknya ada di dalam favicon.ico?

16, 32, dan 48 px Ketiganya mencakup tab browser, pengalih Alt-Tab, dan desktop, dan sudah menjadi set yang dianjurkan sejak 1995. Tambahkan 256 hanya jika ikonnya juga harus bertahan pada tampilan ikon besar.

Bisakah satu file .ico memuat beberapa ukuran?

Bisa — memang untuk itulah formatnya Formatnya memang sebuah kontainer: header enam byte, satu entri direktori enam belas byte per gambar, lalu gambar-gambarnya. Masing-masing adalah gambar terpisah, dan itulah sebabnya ikon yang baik tetap tajam pada 16 px.

Apakah mengonversi PNG ke ICO menghilangkan transparansi?

Tidak, asalkan dikerjakan dengan benar Kedua cara menyimpan gambar di dalam .ico sama-sama membawa kanal alfa delapan bit secara penuh. Transparansi baru hilang ketika sebuah alat membiarkan byte alfa kosong atau membuang mask satu bit yang dibaca perangkat lunak lama sebagai gantinya.

Seberapa besar lapisan 256 px di dalam sebuah .ico?

264 KB tanpa kompresi, atau beberapa KB sebagai PNG Lapisan 256 px tanpa kompresi berukuran tepat 270.376 byte — 40 byte header, 262.144 byte piksel, dan 8.192 byte mask — apa pun gambarnya. Disimpan sebagai PNG, lapisan yang sama biasanya hanya memakan beberapa kilobyte.

Apa itu file ICO?

File .ico bukan format gambar, melainkan lebih mirip arsip kecil berisi beberapa gambar. Ia diawali header enam byte yang menyatakan ada berapa gambar di dalamnya, diikuti satu entri direktori enam belas byte per gambar yang memuat lebar, tinggi, jumlah byte, dan posisinya di dalam file, lalu barulah data gambarnya sendiri. Tiap gambar dapat disimpan dengan salah satu dari dua cara: sebagai file PNG lengkap yang disematkan utuh, atau sebagai bitmap Windows tanpa kompresi dengan mask transparansi satu bit yang dipasang di bawahnya.

Rancangan itulah yang membuat sebuah favicon bisa tampak tajam pada 16 px di tab browser dan pada 48 px di pengelola berkas — keduanya gambar yang berbeda, disetel tangan pada tiap ukuran, bukan satu gambar yang diubah ukurannya. Rancangan itu pula yang menimbulkan beberapa kejutan. Panjang sisi disimpan dalam satu byte, sehingga 256 ditulis sebagai nol dan 512 sama sekali tidak bisa ditulis. Direktori juga mencatat ukuran tiap entri yang sekaligus dicatat oleh data gambarnya sendiri, artinya keduanya bisa berselisih — dan perangkat lunak yang berbeda mempercayai catatan yang berbeda.

$ file favicon.ico
favicon.ico: MS Windows icon resource - 3 icons, 16x16, 32 bits/pixel, 32x32, 32 bits/pixel

$ python3 -c "from PIL import Image; print(sorted(Image.open('favicon.ico').ico.sizes()))"
[(16, 16), (32, 32), (48, 48)]

Apa yang dilakukan konverter ICO ini

Satu file, setiap ukuran yang Anda centang

16, 32, dan 48 px secara bawaan, hingga 256. Setiap ukuran digambar terpisah dari aslinya pada kualitas penuh alih-alih diperkecil dari lapisan di atasnya, sehingga ukuran kecil tidak mewarisi kaburnya ukuran yang lebih besar.

PNG atau bitmap tanpa kompresi, dengan kedua ukuran ditampilkan

Dua format payload yang sah ini punya konsekuensi yang sangat berbeda, dan hampir tidak ada konverter yang menyebutkan mana yang mereka tulis. Di sini pilihannya berupa sakelar, dan ukuran file untuk masing-masing ditampilkan sehingga keputusannya berdasar angka, bukan tebakan.

Transparansi yang selamat lewat jalur mana pun

Kanal alfa ditulis utuh, dan mask satu bit yang dibaca perangkat lunak lama sebagai gantinya diturunkan dari alfa tersebut, bukan dibiarkan kosong. Membiarkan mask itu kosong adalah penyebab ikon transparan berubah menjadi kotak hitam di tempat-tempat yang hanya membaca mask.

Penampil ICO, bukan sekadar pengunduh

Tab arah sebaliknya merinci setiap gambar di dalam .ico beserta ukuran sebenarnya, format penyimpanan, kedalaman bit, dan asal transparansinya — termasuk bitmap berbasis palet yang masih dipakai beberapa favicon terkenal. Browser hanya akan pernah menunjukkan salah satunya.

Memberi tahu Anda saat sebuah file tidak konsisten

Jika direktori mengklaim ukuran yang tidak cocok dengan data gambarnya, hal itu ditandai. Begitu pula PNG tersemat yang akan dibuang Firefox — dekoder ICO-nya hanya menerima RGB atau RGBA 8-bit, sehingga lapisan palet atau skala abu-abu lenyap begitu saja di sana padahal setiap browser lain menampilkannya. Keduanya penyebab umum sebuah ikon tampil di satu program dan kosong di program lain, dan tidak ada konverter lain yang melaporkan salah satunya.

Tidak ada yang diunggah

Pembacaan, pengubahan ukuran, dan pengemasan semuanya terjadi di halaman ini. File tidak pernah sampai ke server, jadi tidak ada yang perlu dihapus setelahnya dan tidak ada antrean yang harus ditunggu.

Mengonversi PNG ke ICO lewat kode

ImageMagick

magick in.png -define icon:auto-resize=48,32,16 favicon.ico

Jawaban yang lazim, sekaligus alasan begitu banyak favicon tersimpan tanpa kompresi. Setiap lapisan kecuali 256 px diubah menjadi bitmap sebelum dikemas, sehingga tiga ukuran keluar sekitar 15 KB alih-alih beberapa ratus byte. Ukuran ditulis dari yang terbesar lebih dulu.

Python + Pillow

img.save('favicon.ico', sizes=[(16,16),(32,32),(48,48)])

Menyematkan PNG, jadi tiga ukuran yang sama memakan kira-kira sepersepuluh ruangnya. Pillow juga membaca ICO dengan baik: Image.open(f).ico.sizes() merinci apa yang ada di dalamnya, praktis untuk memeriksa file milik orang lain.

png-to-ico (npm)

npx png-to-ico icon.png > favicon.ico

CLI bertujuan tunggal yang menerima satu PNG atau lebih dan mengemasnya sebagai payload PNG. Praktis di dalam skrip build; ia tidak mengubah ukuran untuk Anda, jadi tiap ukuran harus Anda sediakan sebagai file tersendiri.

sharp

sharp(input).resize(32).png()

Sangat baik untuk menghasilkan PNG satuan, tetapi ia tidak menulis kontainer ICO, sehingga biasanya dipasangkan dengan salah satu pengemas di atas. Sumber kebingungan yang umum ketika pipeline build sudah terlanjur diseragamkan memakai sharp.

Go

github.com/Kodeworks/golang-image-ico

Menulis ICO bergambar tunggal dari sebuah image.Image. Cukup untuk favicon satu ukuran; mengemas beberapa ukuran ke dalam satu kontainer berarti menulis direktorinya sendiri, kira-kira tiga puluh baris.

Kompiler ikon Windows

Skrip sumber daya .rc, rc.exe

Cara ikon aplikasi biasanya dihasilkan. Kompiler menyematkan .ico ke dalam bagian sumber daya berkas eksekusi; kontainer di dalamnya persis format yang sama dengan favicon web.

GIMP

File → Export As → .ico

Mengekspor tiap lapisan gambar sebagai satu ukuran ikon dan membiarkan Anda memilih kedalaman bit per lapisan, termasuk PNG terkompresi. Salah satu dari sedikit alat grafis yang memperlihatkan pilihan itu alih-alih memutuskannya diam-diam.

sips macOS

sips -s format ico in.png --out favicon.ico

macOS ternyata punya penulis ICO: sips --formats mencantumkan com.microsoft.ico sebagai dapat ditulis, dan perintah di atas menghasilkan berkas yang sah di sini. Yang tidak bisa dilakukannya adalah mengemas beberapa ukuran — keluarannya hanya satu lapisan 48×48. iconutil, yang biasanya disarankan hasil pencarian, menghasilkan .icns, wadah milik Apple sendiri, yang tidak dibaca Windows maupun peramban.

Contoh PNG ke ICO, byte demi byte

38 byte pertama dari .ico tiga ukuran

$ xxd -l 38 favicon.ico
00000000: 0000 0100 0300 1010 0000 0100 2000 e903  ............ ...
00000010: 0000 3600 0000 2020 0000 0100 2000 6c05  ..6...  .... .l.
00000020: 0000 1f04 0000                           ......

0000 adalah medan cadangan, 0100 berarti tipe 1 (ikon, bukan kursor), 0300 menyatakan ada tiga gambar. Lalu entri direktori 16 byte yang pertama: 10 10 berarti 16×16, 00 jumlah warna, 00 cadangan, 0100 satu bidang, 2000 32 bit per piksel, e903 0000 adalah payload sepanjang 1.001 byte pada offset 3600 0000 = 54 — persis 6 + 3 × 16, yaitu akhir direktori. Setiap angka bersifat little-endian kecuali ukurannya, yang hanya satu byte.

Entri 256 px menyimpan nol, bukan 256

bWidth = 0x00    bHeight = 0x00
256 × 256

Direktori hanya punya satu byte untuk tiap sisi, jadi 255 adalah angka terbesar yang bisa ditampungnya dan 0 didefinisikan berarti 256. Ini juga alasan 512 px tidak ditawarkan di mana pun pada halaman ini: tidak ada byte yang berarti 512. Beberapa konverter daring tetap menawarkannya dan menulis gambar 512 px di balik entri direktori yang tidak mampu menjelaskannya.

Tiga ukuran yang sama, dua cara menyimpannya

16 + 32 + 48 px, PNG payloads
16 + 32 + 48 px, uncompressed BMP payloads
389 bytes
15,086 bytes

Payload tanpa kompresi memakan 40 + lebar × tinggi × 4 byte ditambah mask 1 bit, jadi ukurannya hanya bergantung pada dimensi dan sama sekali tidak pada gambarnya. Itulah sebabnya tiga situs berbeda dapat mengirim ikon yang sepenuhnya berlainan dalam file dengan panjang yang identik.

Membangun file yang sama dari baris perintah

$ magick logo.png -define icon:auto-resize=48,32,16 favicon.ico
$ file favicon.ico
favicon.ico: MS Windows icon resource - 3 icons, 48x48, 32 bits/pixel, 32x32, 32 bits/pixel

ImageMagick mengubah setiap lapisan kecuali 256 px menjadi bitmap tanpa kompresi sebelum mengemasnya, itulah sebabnya keluarannya sekitar 15 KB, bukan beberapa ratus byte. Pillow melakukan kebalikannya dan menyematkan PNG: Image.open('logo.png').save('favicon.ico', sizes=[(16,16),(32,32),(48,48)]).

Membongkar kembali sebuah .ico

$ magick favicon.ico favicon-%d.png
favicon-0.png   48×48
favicon-1.png   32×32
favicon-2.png   16×16

Browser tidak bisa melakukan ini untuk Anda. Berikan .ico multi-ukuran ke sebuah tag <img> dan Anda hanya mendapat satu gambar — yang terbesar — tidak peduli bagaimana urutan ukurannya. Merinci isi sebuah file berarti mengurai kontainernya sendiri, dan itulah yang dikerjakan tab ICO → PNG.

Cara mengonversi PNG ke ICO

  1. 1

    Lepas gambar Anda

    PNG, JPG, SVG, WebP, GIF, dan BMP semuanya diterima, hingga 10 MB. Tidak ada yang meninggalkan browser: file dibaca dengan File API dan setiap piksel digambar pada canvas lokal.

  2. 2

    Pilih ukurannya

    16, 32, dan 48 px tercentang sejak awal. Tambahkan 64, 128, atau 256 bila ikon harus bertahan pada tampilan ikon besar atau desktop ber-DPI tinggi. Jika sumber Anda lebih kecil dari ukuran terbesar yang dicentang, halaman ini mengatakannya alih-alih diam-diam memperbesarnya.

  3. 3

    Pilih format penyimpanan

    PNG adalah bawaannya karena ukurannya satu tingkat besaran lebih kecil dan dibaca oleh semua browser saat ini serta setiap Windows sejak Vista. Beralihlah ke bitmap tanpa kompresi jika Anda menginginkan bentuk yang sebenarnya dipakai kebanyakan favicon yang beredar. Kedua ukuran file ditampilkan berdampingan.

  4. 4

    Unduh dan pasang

    Simpan .ico-nya, lalu gunakan tombol Salin tag link untuk markupnya. Jalur /favicon.ico di root masih berfungsi sebagai cadangan, tetapi elemen link yang eksplisit adalah jalur yang diperintahkan untuk dicoba browser lebih dulu.

Mengapa file ICO bisa bermasalah

Lapisan 256 px ditulis sebagai 255

Byte direktori untuk gambar 256 px harus 0. Menulis 255 terlihat seperti kesalahan selisih satu yang tak berbahaya, padahal menghasilkan file yang diam-diam ditolak digambar oleh sebagian browser.

✗ Salah
bWidth = 0xFF   bHeight = 0xFF   ; "255", dimaksudkan sebagai 256
✓ Benar
bWidth = 0x00   bHeight = 0x00   ; 0 didefinisikan berarti 256

Direktori dan gambar berselisih soal ukuran

Ketika entri direktori menyebut 16×16 di atas payload yang sebenarnya 32×32, dekoder terbelah: sebagian memercayai direktori dan sama sekali tidak menggambar apa pun, sebagian lain memercayai payload dan menampilkannya dengan baik. File itu lalu berfungsi di satu mesin dan tak terlihat di mesin lain.

✗ Salah
entry: 16×16     payload IHDR: 32×32
✓ Benar
entry: 32×32     payload IHDR: 32×32

Medan tinggi bitmap tidak digandakan

Di dalam lapisan tanpa kompresi, tinggi mencakup data warna dan mask sekaligus. Menulis tinggi apa adanya menghasilkan file yang tampil kosong pada sebagian dekoder dan sebagai separuh bawah gambar pada sebagian lain, tanpa kesalahan di kedua sisi.

✗ Salah
biHeight = 32        ; untuk gambar 32 px
✓ Benar
biHeight = 64        ; 2 × 32, data warna ditambah mask

Lapisan tanpa kompresi dengan kanal alfa kosong

Sebagian alat mengisi mask dan membiarkan setiap byte alfa bernilai nol. Satu dekoder membacanya sebagai gambar yang sepenuhnya transparan lalu ikonnya lenyap; dekoder lain jatuh kembali ke mask dan menampilkannya dengan benar. Menulis keduanya secara konsisten menghindarkan seluruh perdebatan ini.

✗ Salah
alpha bytes: all 0x00   mask: all 0x00
✓ Benar
alpha bytes: real values   mask: set where alpha < 128

SVG yang menarik file dari internet

Rujukan eksternal di dalam SVG diblokir saat dirasterisasi, dan tidak ada yang melaporkannya — tidak ada kesalahan yang muncul dan canvas tetap dapat dibaca. Placeholder gambar rusaklah yang akhirnya ikut terpanggang ke dalam ikon. Sisipkan karyanya secara inline sebelum mengonversi.

✗ Salah
<image href="https://cdn.example.com/logo.png"/>
✓ Benar
<image href="data:image/png;base64,iVBORw0KGgo…"/>

Kapan Anda butuh konverter PNG ke ICO

Menyiapkan favicon untuk situs baru
Lepas logonya, biarkan tiga ukuran bawaan, unduh favicon.ico, lalu taruh di web root. Tag link yang disalin memberi Anda markup modern untuk ikon yang sama, berdampingan dengan SVG dan ikon sentuh Apple.
Memperbaiki ikon yang tampak baik saat besar dan buram saat kecil
Biasanya file itu hanya punya satu lapisan besar dan sisanya adalah browser yang memperkecilnya. Mengemas lapisan 16 px sungguhan, yang digambar dari sumbernya alih-alih dari versi 256 px, itulah yang memperbaikinya.
Memberi ikon pada aplikasi desktop
Berkas eksekusi, pemasang, dan pintasan Windows menerima .ico, dan bagian shell yang berbeda mengambil ukuran yang berbeda dari file yang sama. Mengemas 16, 32, 48, dan 256 mencakup ikon kecil dalam daftar, pengalih Alt-Tab, dan tampilan ikon besar.
Mencari tahu mengapa ikon tampil di satu tempat dan tidak di tempat lain
Buka filenya pada tab ICO → PNG. Ukuran yang keliru dijelaskan direktori, lapisan tanpa alfa sama sekali, atau entri yang terpotong semuanya muncul dalam daftar, dan tiap lapisan yang baik tetap dapat diekspor meski lapisan tetangganya rusak.
Mengambil kembali PNG dari .ico lama
Ikon warisan proyek lama sering kali satu-satunya salinan sebuah logo yang tersisa. Tab arah sebaliknya mengekspor tiap lapisan sebagai PNG tersendiri, termasuk lapisan yang disimpan sebagai bitmap palet yang ditolak kebanyakan konverter.

Apa yang sebenarnya ada di dalam file .ico

Enam byte, lalu enam belas byte per gambar
Headernya adalah 00 00 cadangan, 01 00 untuk ikon (02 00 menandai file kursor), lalu pencacah dua byte. Tiap entri direktori berisi lebar, tinggi, ukuran palet, dan satu byte cadangan — masing-masing satu byte — diikuti medan bidang dan kedalaman bit dua byte serta dua medan empat byte yang memberikan panjang dan offset payload. Semua yang lebih dari satu byte bersifat little-endian.
Nol berarti 256, dan 512 tidak bisa dinyatakan
Karena lebar dan tinggi hanya satu byte, 256 harus dikodekan sebagai 0 dan apa pun yang lebih besar sama sekali tidak punya pengodean. Menulis 255 alih-alih 0 untuk lapisan 256 px bukan hampiran yang dekat — hasilnya file yang menolak digambar oleh browser. Konverter yang menawarkan opsi 512 px sedang menulis entri yang tidak mampu menjelaskan isinya sendiri.
Lapisan tanpa kompresi memakan tepat 40 + l × t × 4 byte, ditambah mask
Mask menambah ceil(lebar ÷ 32) × 4 byte per baris. Maka lapisan 16 px berukuran 1.128 byte, 48 px 9.640 byte, dan 256 px 270.376 byte — terlepas dari apa isi gambarnya. Biaya tetap itulah yang membuat tiga situs tak berhubungan dapat mengirim favicon dengan panjang byte identik, dan mengapa lapisan 256 px hanya ditawarkan di sini ketika payload-nya PNG.
Header bitmap menyimpan tinggi dua kali lipat
Di dalam lapisan tanpa kompresi, medan tinggi menjelaskan bitmap warna dan mask transparansi yang ditumpuk jadi satu, sehingga ditulis dua kali tinggi sebenarnya bahkan saat mask tidak membawa informasi apa pun. Salah di sini adalah salah satu kegagalan paling senyap dalam format ini: sebagian dekoder menghasilkan gambar kosong, sebagian lain menghasilkan separuh bawah gambar, dan keduanya tidak melaporkan kesalahan.
Medan bidang, kedalaman bit, dan jumlah warna paling banter hanya anjuran
Spesifikasinya rinci soal medan-medan itu dan file nyata mengabaikannya. Situs dokumentasi Microsoft sendiri menyajikan favicon yang direktorinya mengklaim nol bidang dan nol bit per piksel di atas payload empat bit per piksel, dan ikon itu tampil di mana-mana. Dekoder menentukan format sebenarnya dari payload — tanda tangan PNG, atau header bitmap — alih-alih memercayai direktori.
ICO tidak pernah punya RFC
Tipe media image/vnd.microsoft.icon didaftarkan ke IANA pada September 2003, dan rujukan yang disebutkannya adalah artikel Microsoft tahun 1995 berjudul "Icons in Win32". RFC 2361, yang luas dikutip sebagai spesifikasi ICO, sebenarnya berjudul "WAVE and AVI Codec Registries" dan sama sekali tidak membahas gambar.

Menyiapkan favicon.ico dengan benar

Kemas 16, 32, dan 48 lalu berhenti di situ untuk web
Trio itu sudah menjadi set yang dianjurkan sejak 1995 dan masih merupakan kombinasi yang paling sering muncul pada favicon nyata. Ukuran tambahan tidak gratis — tiap satunya adalah satu lapisan lagi yang mungkin diunduh browser sebelum ia tahu lapisan mana yang diinginkannya.
Gambar lapisan 16 px, jangan sekadar memperkecil yang besar
Logo yang bagus pada 256 px biasanya kehilangan goresan tipisnya begitu mencapai 16. Jika ukuran kecil itu penting, sederhanakan karyanya untuk ukuran tersebut — lebih sedikit bentuk, garis lebih tebal — lalu kemas versi sederhana itu sebagai lapisannya sendiri.
Pakai elemen link dan simpan /favicon.ico sebagai cadangan
Spesifikasi HTML hanya memberi tahu browser bahwa mereka boleh mengambil /favicon.ico, dan hanya ketika tidak ada link ikon. Elemen link yang eksplisit adalah jalur yang dapat diandalkan; file di root tetap berguna untuk pembaca umpan, perayap, dan apa pun yang tidak mengurai markup Anda.
Tambahkan ukuran di atas 48 px jika hasil pencarian penting
Panduan favicon Google meminta gambar persegi minimal 8 px dan menganjurkan ukuran lebih besar dari 48 px agar tetap bagus di berbagai permukaan tampilan. Google menerima PNG semudah ICO, jadi ukuran besar itu tidak harus berada di dalam .ico sama sekali.
Periksa filenya, jangan cuma melihatnya
Ikon yang tampil di browser Anda tetap bisa keliru: entri direktori yang tidak cocok, kanal alfa yang hilang, atau lapisan yang tak terbaca tidak akan menghentikan satu gambar yang dipilih browser Anda dari tampil. Membuka file pada tab arah sebaliknya memperlihatkan semuanya.

FAQ PNG ke ICO

Bagaimana cara mengonversi PNG menjadi file ICO?
Lepas PNG-nya di halaman ini, biarkan 16, 32, dan 48 px tercentang, lalu unduh hasilnya. Semuanya berjalan di browser, jadi gambar Anda tidak pernah diunggah. Di baris perintah, padanan yang lazim adalah magick logo.png -define icon:auto-resize=48,32,16 favicon.ico.
Mengapa ikon saya tampak buram pada ukuran kecil?
Hampir selalu karena filenya berisi satu gambar besar dan semua yang kecil adalah browser yang memperkecilnya seketika. Begitu kisi pikselnya mengecil, tidak ada konversi yang benar-benar tanpa kehilangan kualitas — goresan tipis dan detail halus hilang di bawah sekitar 24 px betapapun bagusnya resampling, sehingga kualitasnya ditentukan oleh ukuran mana saja yang dikemas, bukan oleh konverternya. Kemas lapisan 16 px yang sungguhan, dan jika logonya penuh detail, sederhanakan karyanya untuk lapisan itu alih-alih menskalakannya.
Sebaiknya gambar di dalamnya PNG atau bitmap tanpa kompresi?
PNG, kecuali Anda punya alasan untuk tidak memakainya: ukurannya satu tingkat besaran lebih kecil dan dibaca oleh semua browser saat ini serta setiap rilis Windows sejak Vista. Bitmap tanpa kompresi tetap lebih umum di lapangan, sebagian besar karena ImageMagick mengubahnya ke sana secara bawaan, dan pilihan itu lebih aman untuk perangkat lunak yang sangat tua. Halaman ini menampilkan kedua ukuran file sehingga Anda bisa memutuskan berdasar angka.
Mengapa tidak ada opsi 512 px?
Direktori menyimpan panjang tiap sisi dalam satu byte, jadi nilai terbesar yang bisa dinyatakannya adalah 255 dan 0 dicadangkan untuk berarti 256. Tidak ada cara menulis 512. Konverter yang menawarkannya menghasilkan entri direktori yang tidak menjelaskan gambar di baliknya, cara yang ampuh untuk mendapatkan ikon yang ditolak tampil oleh sebagian perangkat lunak.
Apakah PNG dengan latar transparan tetap transparan setelah menjadi ICO?
Ya. Kanal alfa ditulis utuh, dan mask satu bit yang dibaca perangkat lunak lama sebagai gantinya diturunkan dari alfa tersebut, bukan dibiarkan kosong — mask itulah yang membuat latar transparan berubah menjadi kotak hitam pada alat yang membiarkannya kosong. Piksel yang setengah transparan dihitung sebagai transparan di dalam mask ketika alfanya turun di bawah setengah, satu-satunya pilihan yang tersedia karena mask hanya punya satu bit per piksel.
Bisakah saya mengonversi SVG ke ICO?
Bisa, dan sumber vektor adalah masukan terbaik yang mungkin karena tiap ukuran digambar dari geometrinya alih-alih diresample dari bitmap. Satu catatan: apa pun yang ditarik SVG lewat jaringan — gambar yang ditautkan, font jarak jauh, stylesheet yang diimpor — diblokir selama konversi tanpa memunculkan kesalahan. Halaman ini memeriksa rujukan semacam itu dan memperingatkan Anda.
Apakah saya masih butuh favicon.ico di root situs?
Layak disimpan, tetapi itu bukan lagi jalur utamanya. Spesifikasi HTML menyebut browser boleh meminta /favicon.ico, dan hanya ketika halaman tidak punya elemen link ikon. Elemen link adalah yang diperintahkan untuk dipakai browser lebih dulu; file di root mencakup pembaca umpan, perayap, dan apa pun lain yang tidak pernah mengurai HTML Anda.
Apakah Google butuh file ICO untuk hasil pencarian?
Tidak. Dokumentasi favicon Google menerima BMP, GIF, ICO, PNG, JPEG, PPM, dan TIFF, mensyaratkan gambar persegi minimal 8 px, dan menganjurkan ukuran lebih besar dari 48 px agar tampak baik di berbagai permukaan. Satu PNG besar sudah memenuhinya; .ico adalah untuk segala hal lainnya.
Mengapa browser saya hanya menampilkan satu ukuran saat membuka .ico?
Karena hanya itu yang bisa diberikan sebuah elemen gambar. Serahkan .ico multi-ukuran ke browser dan ia memilih satu gambar — dalam praktiknya yang terbesar — dan sisanya tak terjangkau. Merinci setiap lapisan berarti mengurai kontainernya secara langsung, dan itulah yang dilakukan tab ICO → PNG di halaman ini.
Apa artinya ketika direktori dan gambar berselisih soal ukuran?
Artinya file itu tidak konsisten di dalam dirinya sendiri, dan dekoder menanganinya dengan cara yang berlawanan: sebagian memercayai direktori lalu akhirnya tidak menggambar apa pun, sebagian lain memercayai data gambar dan menampilkannya dengan benar. Itu penyebab klasik ikon yang berfungsi di satu mesin dan tak terlihat di mesin lain, jadi halaman ini menandainya saat Anda membuka sebuah file.
Bisakah alat ini membuka file ICO yang ditolak konverter lain?
Sering kali bisa. Lapisan yang disimpan sebagai bitmap palet — empat atau delapan bit per piksel — masih dipakai beberapa favicon terkenal dan banyak konverter menolaknya mentah-mentah. Lapisan yang rusak juga ditangani satu per satu, sehingga satu ukuran yang tak terbaca tidak menghentikan sisanya untuk diekspor. Daftarnya juga menandai setiap lapisan PNG tersemat yang akan dibuang Firefox: dekoder ICO-nya hanya menerima RGB atau RGBA 8-bit, sehingga PNG palet atau skala abu-abu lenyap di sana. Situs Mozilla sendiri pernah mengirim ikon dengan persoalan yang persis sama — lapisan 64 px-nya adalah PNG palet yang dibuang Firefox sendiri, dan hanya lapisan lain yang membuat ikonnya tetap terlihat.
Apakah gambar saya diunggah ke suatu tempat?
Tidak. File dibaca dengan File API browser, digambar pada canvas di halaman ini, dan dikemas ke dalam kontainer oleh JavaScript yang berjalan secara lokal. Tidak ada permintaan yang membawa gambar Anda ke mana pun, dan Anda dapat memastikannya di panel jaringan pada developer tools Anda — atau dengan memuat halaman ini, memutus koneksi, lalu tetap mengonversinya secara offline.