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

O formatador reescreve CSS comprimido ou desarrumado em regras indentadas, mais simples de revisar e de comparar em diffs. Só o espaçamento e a estrutura mudam; a cascata mantém-se igual.

Exemplo

O exemplo começa como um cartão minificado que recupera a indentação.

Entrada

.card{display:flex;padding:1.5rem;border-radius:.5rem;background:#fff}.card h2{font-size:1.25rem;font-weight:600;margin:0 0 .5rem}

Saída

.card {
  display: flex;
  padding: 1.5rem;
  border-radius: 0.5rem;
  background: #fff;
}

Dica

Formate antes da revisão de código e deixe a minificação para o build de produção.