Conversor HTML para JSX
Converta marcacao HTML em codigo React JSX valido instantaneamente
Entrada HTML
Saida JSX
O que e um Conversor HTML para JSX?
Um conversor HTML para JSX transforma marcacao HTML padrao em sintaxe React JSX valida. Em JSX, class vira className e for vira htmlFor.
Colar HTML diretamente em componentes React causa erros de sintaxe. Esta ferramenta automatiza todas as transformacoes necessarias.
Como converter HTML para JSX
Siga estes tres passos para converter HTML em React JSX valido.
Cole ou carregue HTML
Cole seu HTML no painel esquerdo ou clique em Carregar.
Ver saida JSX
class e renomeado para className e elementos vazios sao auto-fechados.
Copiar ou baixar
Clique em Copiar ou Baixar para salvar como .jsx.
Quando usar este conversor
Migrar HTML para React
Converta templates HTML existentes para JSX em projetos React.
Usar mockups de designers
Integre mockups HTML de designers em componentes React.
Aprender JSX
Veja o equivalente JSX de qualquer HTML que voce ja conhece.
Converter templates de email
Converta templates HTML de email para bibliotecas como React Email.
Perguntas frequentes
Por que class vira className?
Em JSX os atributos mapeiam para propriedades DOM do JavaScript. A propriedade DOM para o atributo class e className.
Quais outros atributos sao renomeados?
for→htmlFor, tabindex→tabIndex, onclick→onClick.
Quais elementos vazios sao auto-fechados?
Todos os elementos vazios HTML: <br />, <img />, <input />, <hr />, etc.
Suporta estilos inline?
style="color:red" e convertido para style={{ color: "red" }}.
Meu HTML e armazenado?
Nao. Tudo acontece no seu navegador.
Ferramentas relacionadas
Mais ferramentas para trabalhar com HTML: