HTML to JSX converts raw HTML to React-compatible JSX automatically — renaming class to className, for to htmlFor, converting inline style strings to objects, self-closing void elements, camelCasing event attributes, and wrapping HTML comments in JSX syntax. Paste HTML from a Figma export, email template, or any web page and copy the ready-to-use JSX output directly into your React component.
class becomes className, for becomes htmlFor, and inline styles are converted to objects.style attributes — camelCased property names are used automatically.React JSX is almost identical to HTML but has several important differences that cause syntax errors if you paste raw HTML into a component. This tool automatically handles all the necessary transformations.
class → className (class is a reserved word in JavaScript)for → htmlFor (same reason — reserved word)<br> → <br />, <input> → <input />style="color: red" → style={{ color: "red" }}onclick → onClick{/* */}Also useful: HTML Entity Encode, HTML Preview.