HTML
<img src="a" class="b">
JSX
<img src="a" className="b" />
Design Tools
HTML to JSX — React Attribute Converter
Convert HTML snippets to React JSX in the browser. Rename class/for to className/htmlFor, close void tags, and convert inline styles toward object form. Conversion stays local.
HTMLJSXReact
Favorite this tool
No favorite storage mode has been selected.
Quick actions
Copy this tool URL or open the system share sheet on a supported device.
设计配色
HTML to JSX
Convert HTML snippets to React JSX in the browser. Rename class/for to className/htmlFor, close void tags, and convert inline styles toward object form. Conversion stays local.
原始 HTML
React JSX
Use cases
- Turn static markup into a React component starter
- Paste exported SVG into JSX
- Fix class and for attributes copied from templates
How to use
- Paste or type HTML
- Review the JSX output on the right
- Copy JSX
Example input and output
FAQ
Does it translate scripts or component logic?
No. It only handles DOM-level attribute names, void-tag closing, and related syntax—not framework logic.
How are inline styles handled?
style attributes are converted toward React style objects when possible. Complex expressions still need a manual check.
Tools
Related tools
Continue with another translated tool for a nearby task.
CSS to Tailwind
CSS to Tailwind — Declaration Mapper
Paste CSS declarations and map them to Tailwind utility classes where possible. Common layout, spacing, and color rules become standard classes; unmatched values fall back to arbitrary-value syntax.
CSS Tailwind Convert
HTML to Markdown
HTML to Markdown Converter Online
Convert HTML to Markdown in your browser while preserving common structure such as headings, lists, tables, and links. Useful for migrating web content into editable documents.
HTML Markdown Converter
Markdown to HTML
Markdown to HTML Converter Online
Convert Markdown to HTML in your browser with a live preview, side-by-side view, and copy or export options. Processing stays on the page.
Markdown HTML Converter