HTML to JSX

Convert HTML to React JSX

HTML Input
JSX Output

HTML to JSX Usage Guide

Auto-conversion Rules

  • class → className - Convert HTML class attribute to JSX className
  • for → htmlFor - Convert label's for attribute to htmlFor
  • onclick → onClick - Camelize event attribute names
  • style string → Object - Convert style="color:red" to style={{color:'red'}}
  • Self-closing tags - Auto-add closing slash for br, hr, img, input, etc.

Use Cases

  • Migrate HTML templates to React projects
  • Convert design export HTML to JSX components
  • Quickly transform static HTML into usable React code
  • Learn syntax differences between HTML and JSX

常见问题

相关工具