🔢Matemática 💻Texto & Dev 🪪Documentos 💼Trabalhista 💪Saúde 🏠Casa & Obra 🚗Veículos 📅Datas 🎨Diversão 🖼️Imagem 📊Gráficos 🔎SEO 🔄Conversores 🎬Áudio & Vídeo

🧩Formatador e minificador de HTML

Cole um trecho de HTML para formatá-lo com indentação legível, ou minifique removendo comentários e espaços em branco desnecessários.

É um indentador simples para trechos comuns e bem formados — não é um parser HTML5 completo (não trata casos como fechamento implícito de <p>). HTML complexo ou malformado pode sair com indentação imperfeita.

🔒 Cálculo 100% local — os dados que você digita não saem do seu navegador, nada é enviado a servidores.

Fonte: Indentador HTML por tokenização simples (sem parser DOM completo) — processamento local via divisão de string por < e >, sem análise de árvore DOM real · Última verificação em 23/09/2026

Formatar HTML aqui aumenta a indentação a cada tag de abertura (exceto elementos void, como br e img, que não têm fechamento) e reduz a indentação antes de cada tag de fechamento, colocando cada tag ou trecho de texto em sua própria linha. Minificar remove comentários HTML e colapsa os espaços em branco entre tags, reduzindo o tamanho do arquivo sem alterar a renderização visual.

Como usar o formatador

  1. Escolha formatar ou minificarFormatar deixa o código legível com indentação; Minificar remove tudo que não afeta a renderização.
  2. Cole o HTMLUm trecho de página, um componente ou um template inteiro.
  3. Copie o resultadoO resultado atualiza a cada alteração, pronto para colar no seu editor.

Como funciona a formatação

Esta ferramenta não usa um parser HTML5 completo como o motor de um navegador — ela faz uma tokenização simples, dividindo o texto em tags (tudo entre < e >) e trechos de texto entre elas, e mantém um contador de profundidade de indentação. A cada tag de abertura que não seja um elemento void (como br, img, hr, input, entre outros que não têm fechamento), a profundidade aumenta depois de imprimir a linha. A cada tag de fechamento (``), a profundidade diminui antes de imprimir a linha. Cada tag ou trecho de texto relevante recebe sua própria linha, prefixada por dois espaços multiplicados pela profundidade atual.

No sentido minificar, o processo é mais simples: remove comentários HTML (``), depois colapsa qualquer sequência de espaço em branco entre `>` e `<` para nada, e por fim remove espaços nas pontas do resultado. O efeito visual da página não muda, mas o arquivo fica menor.

Formatar: abertura → imprime, depois profundidade+1 · fechamento → profundidade-1, depois imprime
Minificar: remove <!-- --> · substitui ">espaços<" por "><" · trim()

Exemplo resolvido

Cole `

Título

Um parágrafo com texto em destaque.

` em uma linha só e escolha Formatar. O resultado organiza cada tag em sua própria linha, com a indentação crescendo a cada nível: `
` na profundidade 0, depois `

` e `

` na profundidade 1 (dentro da div), e `` na profundidade 2 (dentro do parágrafo) — cada tag de fechamento reduz a indentação de volta antes de ser impressa.

Agora escolha Minificar sobre um HTML já formatado com quebras de linha e indentação: o resultado remove toda a formatação supérflua e volta a ser uma única linha compacta, sem nenhum espaço entre as tags, exatamente equivalente em renderização ao original, porém menor em bytes — útil antes de embutir um trecho de HTML em um campo de banco de dados ou reduzir o peso de um e-mail transacional em HTML.

Suposições e limitações

  • É um indentador simples por tokenização, não um parser HTML5 completo — não trata regras de fechamento implícito, como um novo <p> fechando automaticamente o <p> anterior
  • Reconhece a lista padrão de elementos void (area, base, br, col, embed, hr, img, input, link, meta, source, track, wbr) para não tentar indentar um "fechamento" que não existe
  • HTML malformado (tags não fechadas, aninhamento incorreto) pode gerar indentação incorreta, já que a ferramenta confia na estrutura declarada pelo próprio texto
  • Não reformata nem valida o conteúdo de blocos &lt;script&gt; ou <style> internamente — trata o conteúdo deles como texto comum entre as tags
  • O processamento é local; o HTML colado não é enviado a nenhum servidor, o que é relevante para templates internos ou trechos de sistemas privados

Dicas para tirar o melhor proveito

Use o modo formatar para revisar um HTML minificado recebido de uma ferramenta externa ou copiado de "ver código-fonte" de uma página, tornando a estrutura de divs, seções e componentes muito mais fácil de entender antes de editar. Use o modo minificar antes de colar um snippet de HTML em um campo de configuração com limite de caracteres, ou para reduzir o peso de um e-mail HTML transacional, já que espaços e quebras de linha entre tags não afetam a renderização visual.

Para HTML complexo, com muitos componentes aninhados ou atributos longos, formate em etapas: cole um trecho menor primeiro para confirmar que a indentação ficou como esperado, depois aplique ao arquivo inteiro. Se a saída formatada parecer estranha em algum ponto, é provável que o HTML de entrada tenha uma tag não fechada ou mal aninhada — nesse caso, vale revisar a origem do HTML antes de confiar cegamente na indentação gerada aqui.

Erros comuns a evitar

Esperar que este formatador se comporte como o parser real de um navegador, que aplica regras específicas do HTML5 como fechamento implícito de tags (por exemplo, `

  • ` que abre automaticamente fecha o `
  • ` anterior dentro de uma lista, mesmo sem `
    • ` explícito) — esta ferramenta não implementa essas regras, então HTML que depende de fechamento implícito pode sair com indentação inesperada, mesmo sendo HTML perfeitamente válido para um navegador.

    Outro erro é minificar HTML que contém `

    ` ou `