About This Tool
Documentation
What does this tool do?
A React migration tool that transforms raw HTML into valid JSX. Automatically converts `class` to `className`, `for` to `htmlFor`, translates inline `style="..."` strings into JavaScript style objects, self-closes void tags (`<img />`, `<input />`, `<br />`), and optionally wraps output in a React Functional Component or TypeScript `.tsx` template.
When should you use it?
Use this tool when porting HTML/CSS templates into React, Next.js, or React Native components, integrating third-party HTML snippets into JSX codebases, or converting SVG icons into React components.
Key Capabilities & Features
Highlights
Convert standard HTML markup into production-ready React JSX and TSX code
Automatic attribute conversion: class to className, for to htmlFor, and kebab-case event handlers
Self-closing tag correction for void elements (<img>, <input>, <br>, <hr> to <img />, <input />)
Inline CSS style string conversion into React style object format (style={{ display: 'flex' }})
Clean component wrapper generation ready to paste into React, Next.js, or Remix projects