Oleh Claire Yoon6 menit baca

Cara Mengonversi WebP ke SVG (Anda Men-trace-nya, Bukan Menyimpannya)

WebP adalah gambar raster, jadi Anda tidak bisa sekadar menyimpannya sebagai SVG. Anda perlu men-trace-nya. Begini cara mengubah WebP menjadi vektor sungguhan yang bersih, dan cara menghindari vektor palsu.

Di halaman ini

WebP adalah gambar raster, yaitu grid piksel seperti JPG atau PNG. Jadi tidak ada "Save As SVG" yang otomatis mengubahnya menjadi vektor. Gambar tersebut harus di-trace dulu menjadi bentuk dan path. Sebagian besar "konverter WebP ke SVG" melewati penjelasan ini, dan beberapa hanya membungkus piksel Anda dalam file .svg lalu menganggapnya selesai. Hasil seperti itu bukan vektor sungguhan.

Berikut cara benar-benar mengonversi WebP menjadi SVG yang bersih dan bisa diedit, hal yang perlu diperhatikan, dan kapan sebaiknya Anda tidak repot melakukannya.

Versi singkat
  • WebP adalah raster, jadi harus di-trace menjadi vektor, bukan sekadar "disimpan" sebagai vektor.
  • Waspadai vektor palsu: konverter yang menyematkan WebP Anda di dalam .svg (hasilnya tetap pecah piksel).
  • WebP bisa lossy atau lossless. WebP lossy membawa noise kompresi, jadi mulai dari sumber paling bersih.
  • Karya datar dengan kontras tinggi paling cocok dikonversi. Foto tidak.
  • Trace dengan konverter WebP ke SVG, lalu cek apakah hasilnya benar-benar bisa diedit.

Pertama, bagian yang dilewati kebanyakan konverter

Kita perlu jelas tentang apa yang sebenarnya terjadi, karena hasil pencarian teratas sering tidak menjelaskannya:

  • WebP menyimpan piksel. Format ini bagus untuk web (file kecil, serta mendukung transparansi dan animasi), tetapi tetap raster.
  • SVG menyimpan matematika: titik, path, dan kurva yang tetap tajam di ukuran apa pun.

Tidak ada "konversi" lossless di antara keduanya. Mengubah WebP ke SVG berarti menggambar ulang piksel sebagai bentuk, yaitu vektorisasi (tracing). Karena itu, konversi sungguhan membutuhkan tracer, bukan sekadar mengganti nama file.

Jebakan yang perlu dihindari: banyak konverter file generik menghasilkan SVG yang sebenarnya hanya WebP Anda yang disematkan di dalam pembungkus .svg. Ekstensinya memang benar, tetapi tetap buram saat diperbesar dan Anda tidak bisa mengedit satu bentuk pun. Jika "SVG" Anda pecah piksel saat diperbesar, itulah yang terjadi. Anda membutuhkan alat yang men-trace gambar menjadi path sungguhan.

Lossy atau lossless? Ini memengaruhi hasilnya

WebP hadir dalam dua jenis, dan jenis yang Anda punya memengaruhi hasil trace:

  • WebP lossy (ekspor web yang umum) memakai kompresi seperti JPG, sehingga membawa artefak serta tepi yang lembut dan penuh noise. Trace akan ikut menangkapnya, jadi mulai dari versi berkualitas tertinggi yang Anda punya. (Masalahnya sama seperti mengonversi JPG ke SVG.)
  • WebP lossless menjaga tepi tetap tajam seperti PNG, sehingga hasil tracing lebih bersih. (Lihat mengonversi PNG ke SVG tanpa kehilangan kualitas untuk panduan sumber yang bersih.)

WebP juga mendukung transparansi, jadi jika gambar Anda memiliki latar belakang transparan, gunakan konverter yang mempertahankannya. Jika tidak, Anda akan mendapat persegi panjang terisi yang tidak diinginkan di belakang bentuk-bentuk Anda.

Cara mengonversi WebP ke SVG, langkah demi langkah

  1. Mulai dari sumber terbaik. Gunakan WebP asli dengan kualitas tertinggi. Jika file itu lossy dan sangat terkompresi, siap-siap mendapatkan trace dengan lebih banyak noise.
  2. Gunakan alat vektorisasi sungguhan, bukan konverter file generik. Anda membutuhkan alat yang men-trace gambar menjadi path, bukan alat yang menyematkan raster.
  3. Vektorisasi gambar. Masukkan WebP ke konverter WebP ke SVG dan biarkan alatnya membangun ulang gambar sebagai path yang bersih dengan jumlah node rendah.
  4. Sederhanakan warna dan pertahankan transparansi. Gabungkan warna yang hampir duplikat (WebP lossy menambahkan beberapa), dan pastikan latar transparan tetap transparan.
  5. Unduh dan cek hasilnya (lihat di bawah).

Seperti apa hasilnya dengan PerfectVector

Tujuan saat memproses WebP adalah vektor sungguhan: path bersih yang bisa Anda edit, bukan piksel yang menyamar. Itulah yang dihasilkan PerfectVector. PerfectVector men-trace WebP menjadi path halus dengan jumlah node rendah, menjaga transparansi tetap utuh, dan memberi Anda editor warna untuk menggabungkan warna tambahan yang biasanya muncul dari WebP lossy. Anda bisa mengonversi WebP menjadi SVG bersih dan memeriksa sendiri path-nya. Anda juga bisa mengonversi gambar pertama secara gratis, tanpa kartu kredit.

Sebelum
WebP lossy dari emblem sederhana dengan tepi lembut dan penuh noise, disematkan sebagai raster di dalam SVG sehingga tetap pecah piksel saat diperbesar
WebP yang dibungkus dalam .svg: tetap piksel, tetap buram saat diskalakan.
Sesudah
Emblem yang sama di-trace menjadi SVG sungguhan dengan path bersih, bisa diedit, dan berjumlah node rendah yang tetap tajam di ukuran apa pun
Trace sungguhan, dengan path bersih yang bisa diedit dan tetap tajam di ukuran apa pun.

Cek cepat hasilnya. Konversi WebP-ke-SVG yang sungguhan punya:

  • Path yang bisa diedit alih-alih WebP yang disematkan dalam .svg (perbesar dan hasilnya harus tetap tajam).
  • Jumlah node rendah, artinya kurva bersih, bukan ribuan titik (selengkapnya tentang jumlah node).
  • Transparansi dipertahankan, jika sumber memilikinya, tanpa persegi panjang latar belakang liar.
  • Palet yang rapi, hanya warna yang Anda maksud, bukan warna tambahan yang dibuat WebP lossy.

Kapan sebaiknya melewati konverter

Tracing tidak cocok untuk setiap WebP:

  • Foto dan gambar fotorealistis akan berubah menjadi gumpalan seperti poster, jadi biarkan tetap raster.
  • Karya yang penuh gradasi atau tekstur kehilangan nuansanya. Bangun ulang sebagai bentuk datar jika Anda membutuhkan vektor.
  • WebP yang sangat kecil atau sangat terkompresi tidak bisa diselamatkan. Cari sumber yang lebih baik atau buat ulang karyanya.

Seperti biasa, vektorisasi ditujukan untuk karya datar dan ilustratif seperti logo, ikon, dan grafik sederhana, bukan foto. (Baru mengenal konsepnya? Mulai dari apa itu vektorisasi gambar.)

FAQ

Bisakah saya langsung menyimpan WebP sebagai SVG? Tidak. WebP adalah gambar raster (piksel), sementara SVG adalah vektor (bentuk dan path). Tidak ada "Save As" yang mengubah satu menjadi yang lain. Gambar harus di-trace menjadi bentuk vektor, dan itulah yang dilakukan alat vektorisasi.

Mengapa WebP saya masih terlihat pecah piksel setelah "dikonversi" ke SVG? Kemungkinan besar konverter generik menyematkan WebP Anda di dalam pembungkus .svg alih-alih men-trace-nya. Itu vektor palsu, dan hasilnya tetap pecah piksel. Gunakan alat yang men-trace gambar menjadi path sungguhan yang bisa diedit.

Bisakah saya mengonversi WebP ke SVG gratis? Ya. Unggah WebP Anda ke alat vektorisasi, sederhanakan warnanya, lalu unduh SVG. Anda bisa mengonversi gambar pertama secara gratis, tanpa kartu kredit. Pastikan saja hasilnya adalah vektor hasil trace yang sungguhan, bukan WebP yang dibungkus dalam .svg.

Apakah transparansi WebP ikut terbawa ke SVG? Bisa, jika Anda memakai konverter yang mempertahankannya. WebP mendukung transparansi, dan trace yang baik menjaga latar belakang tetap transparan sehingga Anda tidak mendapat persegi panjang terisi yang tidak diinginkan.

Bisakah saya mengonversi foto dari WebP ke SVG? Bisa, tetapi biasanya sebaiknya tidak. Foto punya terlalu banyak tone dan gradasi untuk menjadi bentuk yang bersih, jadi hasilnya berupa gumpalan seperti poster atau file yang sangat besar. Vektorisasi dibuat untuk logo, ikon, dan ilustrasi.


Punya logo atau grafik WebP yang perlu diperbesar? Ubah menjadi SVG sungguhan yang bisa diedit, trace, sederhanakan warnanya, dan unduh dalam hitungan detik.

Lebih banyak dari blog

Siap membuat
vektor sempurna?