SVG → JSX / TSX

Convert raw SVG markup into a clean React component with properly transformed attributes

Options

Output Language

Component Name

Spread propsRemove comments

Examples

SVG Input

TSX Output

Output will appear here…

Transformations Applied

class→className

for→htmlFor

stroke-width→strokeWidth

fill-opacity→fillOpacity

clip-path→clipPath

stop-color→stopColor

font-size→fontSize

text-anchor→textAnchor

style="..."→style={{ ... }}

xmlns / xmlns:xlink→(removed)

xlink:href→href

onclick→onClick

DWG · T-SVG-TO-JSX100% client-side·⌘C copy · ESC → grid