SVGをReact JSXに変換
SVGをReact JSXに変換
- 処理はすべてお使いのブラウザ内で行われ、ファイルが端末から送信されることはありません。
- 完全無料・登録不要・利用制限なし。
- モバイルを含む最新ブラウザで動作します。
About this tool
「SVGをReact JSXに変換」は、肥大化したXMLメタデータを取り除き、生のSVGコードをプロダクション対応のReact JSXまたはVue 3コンポーネントに変換します。propsフォワーディング対応です。
How to use
- 生の<svg>マークアップまたはアイコンコードを貼り付けます。
- コンポーネント名・対象フレームワーク（React/Vue）・TypeScript型を設定します。
- クリーン化されコンポーネントで包まれたコードをコードベースに直接コピーします。
FAQ
stroke-widthのような属性名は修正されますか？
はい。すべてのケバブケースのXML属性はReactのキャメルケース（strokeWidth、fillRule、className）に自動変換されます。
TypeScriptに対応していますか？
はい。SVGプロップス<SVGSVG要素>型を含みます。