Membuat ikon aplikasi
Hasilkan favicon klasik, ikon Apple touch, ikon Android/PWA, dan manifes web dalam satu ZIP.
Alat gambar pengembang
Menghasilkan favicon, ikon PWA, srcset, dan aset gambar web
Membuat ZIP ikon yang siap dipasang, set WebP responsif, placeholder LQIP/Data URI, spritesheet, gambar seni piksel, dan pratinjau tekstur secara lokal.
Favikon + PWATool Office
Srcset responsifTool Office
LQIP / Basis64Tool Office
sprite CSSTool Office
Generator aset gambar web
Satu alur kerja pengembang mencakup turunan gambar dan cuplikan kode tanpa halaman terpisah untuk setiap ukuran ikon atau format placeholder.
Alat pemuatan
Alat pemuatan
Cara menyiapkan aset gambar untuk situs web
Mulailah dengan gambar sumber yang bersih, pilih kelompok aset, lalu unduh nama file yang konsisten dan cuplikan implementasi.
Buat gambar responsif
Ekspor beberapa lebar WebP dan salin cuplikan srcset/sizes sehingga browser dapat memilih sumber daya yang sesuai.
Buat pratinjau ringan
Gunakan warna dominan dan URI Data kecil yang buram saat gambar penuh dimuat.
Keluaran siap pengembang
ZIP yang diekspor menyertakan aset dan kode secara bersamaan, sehingga mengurangi kesalahan penamaan dan pemasangan.
Paket ukuran standar
Hasilkan ukuran browser umum, Apple, dan PWA dari satu sumber persegi.
Petunjuk kinerja
Lebar dan placeholder yang responsif membantu menghindari pengiriman satu gambar berukuran besar ke setiap perangkat.
Utilitas kreatif
Membuat atau membagi spritesheet, menskalakan seni piksel, dan memeriksa lapisan tekstur berulang.
FAQ aset gambar web
Ukuran favicon dan PWA manakah yang disertakan?
Paket ini mencakup favicon 16, 32 dan 48 px, ikon Apple touch 180 px, dan ikon Android/PWA 192 dan 512 px.
Bagaimana cara srcset responsif membantu?
Ini memberikan browser beberapa lebar gambar ditambah petunjuk tata letak sehingga dapat memilih sumber daya yang sesuai dengan slot tampilan dan kepadatan piksel.
Apakah placeholder Base64 selalu lebih cepat?
Tidak. Mereka mengurangi permintaan tambahan untuk pratinjau kecil tetapi meningkatkan byte HTML atau CSS. Ukurnya di halaman sebenarnya.