Minificador de CSS
Minifique CSS com o CSSO: remove espaços e comentários, encurta cores e valores e mescla regras com segurança. Mostra os bytes economizados. Grátis, no navegador.
Executa totalmente no seu navegador. Seus dados nunca são enviados.
Ferramentas Relacionadas
Ver TodasO que é Minificador de CSS?
O Minificador de CSS comprime folhas de estilo com o CSSO, um otimizador estrutural. Além de remover espaços e comentários, ele encurta valores (#ff0000 → red, 0px → 0), mescla regras duplicadas e remove declarações redundantes quando isso não pode mudar o resultado.
Como usar Minificador de CSS
- Cole seu CSS na caixa de entrada.
- Clique em Minificar (a saída também é atualizada enquanto você digita).
- Veja a linha de tamanho para conferir a economia.
- Copie ou baixe o CSS minificado.
Exemplo
a { color: #ff0000; margin: 0px 0px; } /* c */ a{color:red;margin:0} Quando usar Minificador de CSS
Use-o em builds de produção de sites pequenos, blocos <style> em linha ou CSS guardado em um CMS. Se o seu build já usa um bundler com cssnano/lightningcss, continue com ele. Mantenha manualmente os comentários de licença se a sua licença exigir.
Como funciona Minificador de CSS
Primeiro, uma varredura rápida verifica chaves, strings e comentários e informa blocos desbalanceados com sua posição. O CSS é então passado para csso.minify com a reestruturação ativada: o CSSO o transforma em uma AST (css-tree), aplica compressões de valores e mesclagem de regras seguras e imprime o resultado sem espaços. Os comentários são removidos, inclusive os comentários de licença /*! … */.
Casos de Uso Comuns
- Minificar uma folha de estilo independente para uma landing page
- Reduzir o CSS crítico antes de embuti-lo
- Comprimir CSS guardado em um banco de dados ou CMS
- Comparar o tamanho otimizado com o original
Nota de Segurança
Tudo roda localmente no seu navegador; o código que você cola não é enviado a nenhum servidor.
Perguntas Frequentes
A minificação pode quebrar meu CSS?
O CSSO só aplica transformações que mantêm o resultado da cascata, mas sempre teste a saída.
Por que #ff0000 virou red?
red é mais curto e significa exatamente a mesma cor.
Os comentários de licença são mantidos?
Não, todos os comentários são removidos. Adicione a licença de volta manualmente, se necessário.