Conversor HTML a JSX
Convierte HTML a JSX para componentes React al instante. Transforma class a className, estilos en línea a objetos y autocierra elementos vacíos. Herramienta online gratuita.
Referencia
¿Qué cambia de HTML a JSX?
JSX es una extensión de sintaxis para JavaScript utilizada por React para describir la interfaz de usuario. Aunque se parece a HTML, JSX tiene diferencias importantes porque se compila a llamadas de funciones JavaScript. Esta herramienta aplica automáticamente todas las transformaciones requeridas: class → className, for → htmlFor, cadenas de style en línea → objetos de estilo camelCase, atributos booleanos → booleanos JSX explícitos, tabindex → tabIndex y otros renombramientos de atributos. Los elementos vacíos (<img>, <br>, <input>, <hr>) se autocierran con />.
Reglas de conversión a JSX
Transformaciones clave que realiza este conversor: Renombrado de atributos — class → className, for → htmlFor, tabindex → tabIndex, readonly → readOnly, maxlength → maxLength. Objetos de estilo — style="color: red; font-size: 14px" se convierte en style={{ color: 'red', fontSize: '14px' }}. Etiquetas autocerradas — <img src="..."> se convierte en <img src="..." />. Manejadores de eventos — onclick → onClick, onchange → onChange. Comentarios — los comentarios HTML se convierten en bloques de comentarios JSX {/* comentario */}. Activa la opción TypeScript para generar salida compatible con TSX.
Privacidad
Toda la conversión se ejecuta 100% en tu navegador. Ningún dato HTML se envía a ningún servidor.