AppHelp
把 SVG 轉成 React 或 TypeScript 元件
貼上或開啟 SVG,設定 JSX 與 TypeScript 選項,再於本機複製或下載元件。
SVG 轉 React 元件工作區
將 SVG 屬性轉成 JSX、加入 React props,並在本機匯出 JSX 或 TypeScript。
1. SVG 輸入
2. 元件選項
常見任務
- SVG 轉 JSX
- SVG 轉 React
- SVG 轉 TSX
- React SVG 元件
快速答案
貼上 SVG、設定元件名稱,選擇 JSX 或 TypeScript,再設定響應式尺寸、currentColor、標題、描述、memo、ref 與匯出;全程留在瀏覽器。
使用步驟
- 1. 輸入 SVG貼上 SVG 標記或開啟檔案。
- 2. 選擇選項設定名稱、型別、顏色、尺寸、props 與匯出。
- 3. 測試並匯出複製、格式化並在目標專案測試。
功能特點
- React 相容 JSX 屬性
- JSX 或 TypeScript 輸出
- 響應式尺寸與 currentColor
- 標題、描述、memo 與 ref 選項
- 本機預覽與下載
常見問題
- 檔案會上傳嗎?
- 不會。轉換、預覽與匯出均在瀏覽器本機完成。