O que é Minificador CSS?

O CSS Minifier comprime seu CSS removendo espaços em branco, comentários e sintaxe redundante. Arquivos menores baixam mais rápido e elevam sua pontuação no PageSpeed.

Por baixo dos panos o minificador roda o algoritmo do CSSO, que vai além de remover espaços. Ele funde regras adjacentes com o mesmo seletor, elimina redundâncias da notação curta (margin: 10px 10px 10px 10px vira margin: 10px), retira prefixos de fabricante que você já não precisa e encurta cores hex de seis dígitos para três quando possível.

Como usar

1. Cole seu código CSS na área de entrada, faça upload de um arquivo .css ou carregue uma folha de estilos direto de uma URL.
2. Clique em minificar para comprimir — a ferramenta remove comentários, espaços em branco e encurta valores.
3. Copie o resultado minificado ou baixe como arquivo .css. Confira a taxa de compressão exibida.

Quando usar

• Publicar o stylesheet de um site estático que não passa por build.
• Comparar duas versões de um CSS para ver quanta repetição há no código escrito à mão.
• Espremer cada byte ao embutir CSS crítico dentro do head do HTML.

Resultado

Uma folha de estilos de 24KB com comentários e formatação é minificada para 16KB — uma redução de 33% que economiza 50ms no tempo de carregamento em conexões 3G.

Perguntas frequentes

O CSS minificado renderiza diferente do original?

Os navegadores interpretam CSS minificado e formatado de maneira idêntica. Cascade, especificidade e estilos computados continuam iguais. Só muda o tamanho do arquivo no disco e no tráfego.

Devo aplicar gzip por cima também?

Sim. Gzip sobre a minificação reduz mais 60 a 80%. A maioria das CDNs aplica gzip automaticamente. Ainda assim minificar antes ajuda, pois o gzip comprime padrões repetidos, e CSS minificado tem muitos.

A minificação quebra meus source maps?

Esta ferramenta não gera source maps porque trabalha em uma única string de CSS, e não em um grafo de build. Se precisar de mapas, use um bundler como esbuild ou Vite, que emite .css.map ao lado do CSS minificado.

Por que meu arquivo minificado ainda tem alguns espaços?

CSS mantém espaços dentro de strings, entre partes de seletor (.a .b é diferente de .a.b) e dentro de expressões calc(). O minificador só remove o espaço que não carrega significado e deixa o restante.

É seguro minificar CSS que usa custom properties (variáveis CSS)?

Sim. Nomes e valores das propriedades personalizadas permanecem intactos. O minificador só ajusta o formato em volta. Variáveis como --brand-color sobrevivem do jeito que você escreveu e seguem funcionando em var().

Ferramentas relacionadas