Ir para o conteúdo
HandfulTools

Formatador e minificador de CSS

Expanda um CSS minificado para uma declaração por linha, para ler ou depurar, ou minifique a sua folha de estilo para reduzir o tamanho dela em produção.

Funciona no seu navegador

Loading…

Como usar

  1. Cole o seu CSS.
  2. Escolha entre formatar e minificar.
  3. Copie o resultado.

Como funciona

A folha de estilo é tokenizada de um jeito que as strings entre aspas (como content: "a;b") e os comentários nunca são alterados. Ao formatar, cada seletor, cada declaração e cada chave de fechamento ficam na própria linha, com indentação consistente, inclusive nas regras aninhadas dentro de @media.

A minificação tira os comentários (menos os comentários de licença /*!), os espaços em branco e o último ponto e vírgula de cada bloco. Os espaços que mudam o sentido, como os que ficam em volta de + e - dentro de calc(), são mantidos.

Exemplos

Framework minificado
.a{color:red}.b:hover{color:blue} vira duas regras legíveis, com as declarações indentadas.

Usos comuns

  • Ler um CSS de terceiros ou minificado
  • Reduzir o tamanho de uma folha de estilo
  • Padronizar o CSS antes da revisão de código

Privacidade e segurança

Esta ferramenta funciona inteiramente no seu navegador. Seus arquivos e textos nunca são enviados para os nossos servidores — o processamento acontece no seu dispositivo e o resultado também é criado ali. Como cada ferramenta trata os arquivos

Perguntas frequentes

Isso substitui uma ferramenta de build?

Para sites em produção, ferramentas de build como o Lightning CSS ou o cssnano otimizam bem mais fundo. Esta ferramenta é ideal para uma formatação rápida e pontual.

Funciona com SCSS ou Less?

O aninhamento básico é formatado corretamente, mas a sintaxe específica de pré-processador, como os mixins, não tem garantia.

Última atualização: