SVG to Code

將 SVG 標記轉換為 HTML / JSX / Vue SFC 程式碼

貼上 SVG 標記並將其轉換為乾淨的 HTML、JSX 或 Vue 代碼。自動處理屬性轉換 (例: JSX 的 class → className)。

輸出模式

使用方法

Select an output mode: HTML, JSX (React), or Vue Template。
Paste your SVG markup into the input field。
Read the converted code in the output box, where JSX mode renames class to className and converts kebab-case attributes to camelCase。
Copy the output with the copy button。
Verify the live SVG preview below the output to confirm the graphic looks correct。

範例

Pasting an SVG with class="icon" and stroke-width="2" in JSX mode outputs className="icon" and strokeWidth="2"。
Switching the same input to Vue Template mode replaces class= with :class= while leaving all other attributes unchanged。

生產環境使用前請驗證輸出。無擔保 — 參見條款.