HTML → JSX Converter
Free online HTML to JSX converter — automatically converts class to className, for to htmlFor, self-closes void elements, and transforms inline styles to JSX objects.
Changes made
- Paste your HTML snippet into the input area.
- Click Convert to JSX.
- The changes summary lists every transformation applied.
- Copy the JSX output and paste it into your React component.
FAQ
What HTML attributes are changed in JSX?
class becomes className, for becomes htmlFor, tabindex becomes tabIndex, and all event handlers are converted to camelCase (onclick → onClick, onchange → onChange, etc.).
How are void elements handled?
HTML void elements like <img>, <input>, <br>, <hr>, <link>, and <meta> are self-closed in JSX (e.g., <img /> instead of <img>).
What happens to inline style attributes?
style="color: red; font-size: 16px" is converted to the JSX object syntax: style={{color: "red", fontSize: "16px"}}.