Formatador e Embelezador de HTML

Formate, embeleze ou minifique HTML válido e malformado sem precisar enviar seu código.

Privado por padrão — a formatação acontece no seu navegador

Área de trabalho do Formatador de HTML

Configurações de formatação
Configurações de formatação
0 caracteres 0 linhas
0 caracteres 0 linhas
Pronto para HTML

Formatador de HTML e embelezador de HTML online

Cole um documento HTML, componente, modelo de e-mail, snippet gerado ou resposta minificada e escolha Formatar HTML para embelezar a marcação. Use-o para formatar HTML online: indentação consistente e quebras de linha embelezam o código HTML e transformam uma resposta minificada em um HTML bonito e mais fácil de revisar. Escolha Minificar quando precisar de uma cópia compacta, mantendo intacto o conteúdo bruto dentro dos elementos pre, textarea, script e style.

Como formatar ou embelezar HTML

  1. Cole HTML válido, minificado, incompleto ou malformado no painel de entrada.
  2. Escolha as configurações de indentação, quebra de linha e nova linha, depois selecione Formatar HTML.
  3. Revise qualquer aviso, depois copie, baixe ou visualize o resultado no Visualizador de HTML.

Um formatador que ainda funciona com HTML quebrado

Trabalho incompleto é comum durante a edição: uma tag de fechamento pode estar faltando, o aninhamento pode estar incorreto ou a aspa de um atributo pode não estar finalizada. Este formatador de código HTML usa um tokenizador tolerante para reformatar o código HTML e retornar o melhor resultado possível, em vez de bloquear no primeiro problema de sintaxe. Avisos informativos indicam quando o código-fonte parece malformado, mas a estrutura original não é reanalisada silenciosamente pelo navegador.

Formatação de HTML não é validação de HTML

Um formatador altera espaços em branco e indentação. Um validador verifica a conformidade com as regras do HTML, enquanto um analisador de navegador também pode inferir elementos ausentes e reparar uma árvore de documento. Este formatador não promete nenhum desses resultados: revise os avisos e teste a saída em um visualizador de HTML ou navegador antes de usá-la em produção.

Visualize o HTML formatado com segurança no Visualizador de HTML.

Processamento de HTML privado e local

Sua entrada e a saída formatada permanecem nesta aba do navegador. A formatação, minificação, cópia e preparação para download são executadas localmente, sem necessidade de conta ou upload.

Quando um formatador de HTML não é suficiente

Use este formatador para embelezar HTML de um snippet, resposta gerada ou para uma limpeza rápida. Mude para o Phoenix Code quando o trabalho abranger HTML, CSS, JavaScript, ativos e múltiplos arquivos, ou quando você precisar de Live Preview, busca em todo o projeto, Git e inteligência de código em um único editor.

Perguntas frequentes

Este formatador consegue formatar HTML inválido ou malformado?

Sim, em modo de melhor esforço. Ele consegue indentar muitos trechos com tags de fechamento ausentes, aninhamento incorreto ou tags de fechamento opcionais. Tokens inacabados e não seguros são preservados literalmente com um aviso para que a formatação não os reinterprete silenciosamente.

A formatação corrige HTML quebrado?

Não. A formatação torna o código-fonte mais fácil de ler, mas não garante que a sintaxe ou a semântica serão corrigidas. A ferramenta evita substituir silenciosamente seu código-fonte por um documento reconstruído pelo navegador, para que você mesmo possa ver e corrigir a marcação original.

Minificar o HTML altera o conteúdo de script, style, pre ou textarea?

O minificador protege essas regiões de conteúdo bruto e remove apenas os espaços em branco de formatação conservadora no restante da marcação. Sempre teste templates sensíveis ao comportamento antes da implantação.

O meu HTML é enviado?

Não. O formatador e o minificador rodam localmente no seu navegador, e os downloads são criados no seu dispositivo.

Leve o HTML formatado para um editor de código completo

O Phoenix Code é o próximo passo para trabalhos em nível de projeto com HTML, CSS e JavaScript, com Live Preview, busca no projeto, Git e inteligência de código.