Como usar

Quatro passos: colar, executar, rever, copiar. Tudo fica no navegador.

Cole o conteúdo

Introduza CSS, HTML, JSON ou outro texto. Nada é enviado.

Execute a ferramenta

Clique em Converter ou Executar. O resultado aparece na hora.

Reveja a saída

Leia o código gerado e as notas antes de usar.

Copie e use

Copie o resultado e cole no seu projeto.

Sobre esta ferramenta

A ferramenta indenta HTML para que a estrutura aninhada fique evidente antes de converter estilos ou de revisar landmarks de acessibilidade. Não corrige marcação inválida — os validadores continuam a ser necessários.

Exemplo

O exemplo é um bloco hero compacto escrito numa única linha.

Entrada

<section class="hero"><h1>CSS to Tailwind</h1><p>Convert utilities in the browser.</p><a href="/">Open</a></section>

Saída

<section class="hero">
  <h1>CSS to Tailwind</h1>
  <p>Convert utilities in the browser.</p>
  <a href="/">Open</a>
</section>

Dica

Indentação que salta de forma estranha revela quase sempre uma etiqueta sem fecho.