HTML → JSX

Convert HTML to JSX/React. Transforms class→className, for→htmlFor, inline styles to objects, event handlers, self-closing tags, and boolean attributes.

HTML input

JSX output

<div className="container">
  <h1>Hello World</h1>
  <label htmlFor="name">Name:</label>
  <input type="text" id="name" className="input" autoFocus readOnly tabIndex="1" />
  <img src="photo.jpg" alt="A photo" />
  <br />
  <p style={{ color: "red", fontSize: "16px", marginTop: "10px" }}>
    Styled paragraph
  </p>
  <button onClick={() => { alert('hello') }} className="btn">Click me</button>
  {/*  This is a comment  */}
  <hr />
  <select>
    <option value="1" selected>One</option>
    <option value="2" disabled>Two</option>
  </select>
</div>

Related tools

HTML to MarkdownConverter

Convert HTML to Markdown. Handles headings, links, images, lists, tables, and code.

HTML → TextConverter

Convert HTML into plain text locally in your browser.

HTML Entities Encoder/DecoderEncoding

Encode/decode HTML entities in-browser.

HTML Escape/UnescapeEncoding

Escape/unescape HTML special characters locally in your browser.

HTML FormatterCode

Format/prettify HTML locally in your browser.

HTML Minifier (basic)Code

Minify HTML quickly in your browser.