Konverter Gratis

Konverter SVG ke PNG

Konversikan file vektor SVG ke gambar raster PNG berkualitas tinggi. Sesuaikan skala output dan warna latar belakang dengan mudah di browser Anda.

Tarik & Lepas SVG di sini

Mendukung hingga 50MB

Atau

Tentang alat ini

SVG (Scalable Vector Graphics) mendeskripsikan gambar sebagai sekumpulan primitif geometris — jalur, bentuk, teks, gradien — yang dapat diskalakan ke ukuran apa pun tanpa kehilangan kualitas. PNG menyimpan satu kotak piksel persegi panjang dengan resolusi tetap. Mengonversi SVG ke PNG merupakan langkah rasterisasi: instruksi gambar SVG dievaluasi pada ukuran piksel yang dipilih dan bitmap yang dihasilkan dikodekan sebagai PNG. Outputnya terlihat tajam pada ukuran yang Anda tentukan tetapi menjadi piksel jika diperbesar.

Konverter ini merender SVG menggunakan mesin SVG bawaan browser. SVG dimuat ke dalam elemen Gambar, digambar ke kanvas HTML5 pada dimensi keluaran yang dipilih, dan diekspor sebagai PNG melalui canvas.toBlob. Karena browser melakukan rasterisasi, fitur SVG yang kompleks — gradien, filter, masker, animasi sebagai bingkai statis — dirender dengan cara yang sama seperti pada laman web sebenarnya.

Keputusan terpenting dalam konversi SVG ke PNG adalah ukuran target. SVG tidak bergantung pada resolusi, jadi memilih ukuran PNG yang sesuai dengan penggunaan sebenarnya akan menghindari penyediaan yang berlebihan (file besar untuk ikon berukuran thumbnail) dan penyediaan yang kurang (output buram saat diperbesar nanti). Target umum: 32×32 atau 64×64 untuk ikon, 256×256 atau 512×512 untuk logo, 1024×1024 untuk grafik pahlawan, 2048×2048 untuk aset berkualitas retina.

Mengapa Mengonversi SVG ke PNG

SVG bagus untuk web dan alat desain modern, tetapi buruk untuk banyak konteks lainnya. Klien email menampilkan SVG secara tidak konsisten; beberapa memblokirnya karena risiko keamanan. Perangkat lunak perkantoran lama, CMS tertentu, layanan pihak ketiga, dan hampir semua jalur pencetakan foto tidak menerima SVG sama sekali. Mengonversi ke PNG menghasilkan raster yang diterima secara universal dan terlihat identik pada ukuran yang dipilih.

PNG juga dapat disematkan dengan andal ke dalam dokumen kantor, slide deck, dan PDF tanpa bergantung pada penyaji SVG penerima. Untuk logo dan grafik yang perlu tampil secara konsisten di banyak platform, PNG adalah pilihan yang lebih aman — meskipun PNG kehilangan independensi resolusi yang menjadikan SVG menarik.

Cara menggunakan

Pilih ukuran target Anda, render. Browser melakukan rasterisasi.

  1. Unggah berkas SVG: Seret SVG ke area unggah atau klik untuk menelusuri. File hingga 50 MB didukung, meskipun SVG umumnya berukuran di bawah 1 MB. SVG mandiri berfungsi paling baik; SVG yang mereferensikan gambar eksternal melalui xlink:href ke URL jarak jauh mungkin tidak lengkap.
  2. Pilih ukuran keluaran: Defaultnya adalah dimensi viewBox asli SVG, tetapi Anda dapat menggantinya ke ukuran piksel apa pun. Pilih ukuran yang sesuai dengan penggunaan Anda yang sebenarnya — hindari membuat PNG 4K untuk ikon yang akan ditampilkan dalam ukuran 32×32.
  3. Render: Browser mem-parsing SVG, menggambarnya ke kanvas sesuai dimensi yang diminta, dan mengekspor kanvas sebagai PNG. SVG kompleks dengan filter atau jumlah jalur yang besar mungkin memerlukan waktu beberapa saat; ikon sederhana ditampilkan secara instan.
  4. Unduh PNGnya: Simpan berkasnya. Transparansi dalam SVG (apa pun di luar bentuk yang digambar) dipertahankan sebagai saluran alfa di PNG.

Kasus Penggunaan Umum

Detail Teknis

SVG (Rekomendasi W3C) adalah format vektor berbasis XML dengan elemen untuk jalur, bentuk dasar (persegi, lingkaran, elips, garis, poligon, polyline), teks, gradien (linearGradient, radialGradient), filter, masker, dan jalur klip. Browser mem-parsing XML, membuat DOM, menerapkan CSS, dan melakukan rasterisasi hasilnya selama rendering halaman.

Konverter ini memuat SVG ke dalam HTMLImageElement (yang memicu jalur rendering SVG-sebagai-gambar normal browser), lalu menariknya ke kanvas melalui drawImage. Kanvas diekspor sebagai PNG menggunakan canvas.toBlob('image/png'). Piksel persis dalam keluaran cocok dengan apa yang akan dirender SVG pada ukuran yang sama di tab browser.

Kasus tepi: SVG menggunakan objek asing tidak selalu didukung saat digunakan melalui elemen Gambar. SVG yang mereferensikan sumber daya eksternal (xlink:href ke domain berbeda) mungkin gagal dimuat karena CORS. Animasi SMIL dan animasi berbasis JavaScript dirender sebagai frame awal saja.

Praktik Terbaik

Pertanyaan yang sering diajukan

Apakah SVG saya akan kehilangan kualitas saat dikonversi ke PNG?
Konversi vektor-ke-raster berarti gambar menjadi berbasis piksel dan tidak dapat lagi diskalakan tanpa batas. Pilih resolusi tinggi untuk memastikan PNG terlihat tajam pada ukuran tampilan yang Anda inginkan.
Untuk apa format PNG digunakan?
PNG (Portable Network Graphics) terutama digunakan untuk grafik dengan transparansi, tangkapan layar, logo, ikon.
Apakah ada batasan yang perlu diperhatikan?
File hingga 50MB didukung. File yang sangat besar atau kompleks mungkin memerlukan waktu lebih lama untuk diproses. Semua konversi terjadi di browser Anda, jadi kecepatan pemrosesan bergantung pada perangkat Anda.
Apakah gambar saya dirahasiakan selama konversi?
Ya. File SVG Anda diproses seluruhnya di dalam browser Anda menggunakan Canvas API dan JavaScript. Tidak ada yang diunggah ke server mana pun — file langsung dikirim dari perangkat Anda ke konverter dan kembali ke perangkat Anda.
Apakah teks dirender sebagai teks atau sebagai jalur?
Teks diraster sebagai piksel dalam keluaran PNG. Outputnya tidak lagi dapat dicari atau dipilih. Jika SVG Anda menggunakan font yang tidak tersedia di browser, teks mungkin dirender dalam font cadangan; konversikan teks ke jalur di SVG sebelum merender untuk tampilan yang terjamin.
Apakah SVG saya diunggah ke server?
Tidak. Penguraian dan rendering SVG terjadi di browser Anda; Pengkodean PNG terjadi di browser Anda. File tersebut tidak meninggalkan perangkat Anda.
Mengapa PNG saya yang dikonversi kosong?
Penyebab umum: SVG mereferensikan gambar eksternal yang gagal dimuat karena CORS; SVG menggunakan fitur yang tidak didukung oleh jalur rendering elemen Gambar (foreignObject, filter tertentu); SVG memiliki viewBox berdimensi nol. Buka SVG langsung di browser untuk mengonfirmasi renderingnya sebelum mengonversi.
Bisakah saya mengonversi SVG ke PNG dalam skrip?
Ya — untuk pekerjaan batch, pengaturan Node.js menggunakan sharp atau dalang merender SVG ke PNG dengan fidelitas serupa dengan browser. Alat ini untuk konversi satu kali di browser tanpa menginstal apa pun.