RUNWEBTOOLS
Português

Formatador de CSS

Embeleze e organize CSS bagunçado ou minificado no seu navegador.

Ao vivo — formata enquanto você digita

Exemplos

Embelezar CSS minificado

Entrada

.btn{color:#fff;background:#000;padding:8px 16px;}

Saída

.btn {
  color: #fff;
  background: #000;
  padding: 8px 16px;
}

Organizar espaçamento inconsistente

Entrada

a{color:blue;}  a:hover{color:red;}

Saída

a {
  color: blue;
}

a:hover {
  color: red;
}

Sobre esta ferramenta

Este formatador de CSS online e gratuito transforma folhas de estilo bagunçadas ou minificadas em CSS limpo e bem indentado — uma ferramenta rápida de embelezar e imprimir CSS de forma legível. Cole seu CSS, escolha um estilo de indentação, e o resultado formatado aparece na hora. Tudo roda no seu navegador sem upload, então seu código nunca sai do seu dispositivo.

Como usar

  1. Cole seu CSS na caixa de entrada (clique em Exemplo para testar).
  2. Escolha uma indentação de 2 espaços, 4 espaços ou um tab.
  3. Leia o CSS embelezado na caixa de saída à direita.
  4. Copie o resultado com o botão Copiar.

Quando usar um formatador de CSS

Reformatar ajuda quando você copia CSS comprimido de um bundle compilado, herda uma folha de estilo com espaçamento inconsistente ou quer ler uma regra antes de editá-la. Uma indentação consistente deixa seletores e aninhamento óbvios e mantém os diffs limpos.

Perguntas frequentes

Este formatador de CSS é grátis?

Sim — é um formatador e embelezador de CSS online totalmente gratuito, sem cadastro e sem limites. Formate e indente quanto CSS quiser.

Meu CSS é enviado a um servidor?

Não. É uma ferramenta sem upload — seu CSS é formatado inteiramente no seu navegador, então o código nunca sai do seu dispositivo. Seguro para folhas de estilo privadas ou internas.

O que o embelezador de CSS faz?

Ele põe cada regra e declaração em sua própria linha, normaliza o espaçamento em torno de chaves, dois-pontos e ponto e vírgula, e reindenta tudo, de modo que CSS minificado ou bagunçado fica legível.

Posso escolher a indentação?

Sim — escolha 2 espaços, 4 espaços ou tabs. Sua escolha é lembrada no navegador para a próxima vez.

Funciona com SCSS ou Less?

Ele lida bem com a maior parte da sintaxe SCSS e Less para indentar e organizar, já que a estrutura é parecida com CSS. Ele formata em vez de compilar — não expande aninhamentos nem variáveis.

Ele expande CSS minificado?

Sim. Cole uma folha de estilo de uma linha ou minificada e ele a expande de volta para um conjunto de regras legível e bem indentado.

Funciona offline e no celular?

Depois que a página carrega, ele roda localmente, então continua funcionando em conexão instável, e o layout é totalmente responsivo em celulares e tablets.

Ferramentas relacionadas

Formatador de JSON

Formate, valide e embeleze JSON na hora, no seu navegador.

Formatador de HTML

Embeleze e indente HTML bagunçado ou minificado no seu navegador.

Formatador de JavaScript

Embeleze e indente JavaScript minificado ou bagunçado no seu navegador.

Formatador de SQL

Formate consultas SQL com as palavras-chave em maiúsculas.