Alat Pratinjau SVG

Bagaimana cara cepat melihat hasil rendering kod SVG?

Dalam alur kerja anda, pereka mungkin memberikan kod SVG secara langsung atau mengeksport coretan kod daripada alat vektor. Dengan alat ini, cukup salin dan tampal kod anda ke dalam editor di atas untuk melihat rendering masa nyata. Jika anda tidak tahu cara membuka fail SVG untuk menyemak hasilnya, import sahaja fail SVG ke dalam alat ini untuk melihatnya. Anda juga boleh melihat dengan serta-merta bagaimana rupa SVG anda pada warna latar belakang yang berbeza (Mod Terang/Gelap) untuk memastikan konsistensi reka bentuk.

Langkah-langkah untuk melihat dan mempratinjau kod dan fail SVG dengan cepat

1. Tampal Kod: Hanya tampal kandungan <svg>...</svg> ke dalam kawasan teks.
2. Seret & Lepas: Seret mana-mana fail .svg dari komputer anda dan lepaskan ke dalam editor untuk menganalisisnya dengan segera.
3. Periksa Perincian: Gunakan butang zum (±1, ±5) untuk melaraskan skala bagi pemeriksaan terperinci.
4. Integrasi Pantas: Tukar antara "Contoh Implementasi" untuk mendapatkan kod bagi img src, viewBox dan banyak lagi.

Ciri-ciri alat pratinjau SVG dalam talian ini

• Sepenuhnya Percuma: Alat dalam talian, tidak memerlukan pendaftaran atau muat turun.
• Senkronisasi Masa Nyata: Kemas kini segera semasa anda mengedit kod.
• Penukaran Pintar: Menjana tag img berkod Base64 dan kod viewBox yang dioptimumkan secara automatik.
• Keupayaan Zum: Pratinjau masa nyata selepas mengezum, dan anda boleh menyalin kod SVG yang diskalakan.
• Pelbagai Jenis Integrasi: Salin kod SVG dengan cepat untuk Base64, Inline, latar belakang CSS dan banyak lagi. Jika anda tidak pasti cara menggunakan SVG dalam pembangunan web, gunakan sahaja alat ini untuk menyalin kod!
• Mesra Pengguna: Menyokong zum, skrin penuh dan pensuisan latar belakang untuk pengalaman debugging visual terbaik.

Butiran Ciri Alat Pratinjau SVG