Minificador de CSS

Minifica e comprime CSS num só lugar

Este minificador de CSS reduz as suas folhas de estilo eliminando cada carácter que o browser não necessita — comentários, espaços em branco, quebras de linha e o ponto e vírgula final redundante em cada regra — para que o ficheiro que envia seja mais pequeno em bytes mas renderize de forma idêntica. Cole o seu código ou arraste um ficheiro .css e o resultado comprimido aparece instantaneamente, com os bytes exactos e a percentagem poupada.

É também um compressor de CSS e um embelezador de CSS num só: um único botão alterna entre minificar e desminificar, pelo que a mesma ferramenta que comprime uma folha de estilo pode expandi-la de volta a código legível com indentação.

O que remove — e o que nunca toca

Quando minifica CSS, a ferramenta elimina comentários, colapsa todos os espaços em branco, remove os espaços à volta de símbolos como { } : ; , > + e suprime o último ponto e vírgula antes de cada chaveta de fecho. Active o modo Agressivo e também elimina zeros iniciais (0.5em → .5em) e a unidade em valores de comprimento zero (0px → 0).

Crucialmente, é sem perdas. Strings entre aspas, valores url() e expressões calc() são protegidos antes de qualquer eliminação, pelo que um valor como calc(100% - 2rem) conserva os seus espaços necessários e o caminho de uma imagem de fundo nunca é alterado. Muitos minificadores online rápidos falham com calc() — este não.

Minifica ou embeleza — uma verdadeira ferramenta bidirecional

Precisa de ler uma folha de estilo comprimida numa só linha? Mude para o modo Embelezar para desminificar CSS: a ferramenta re-indenta o código, coloca cada declaração na sua própria linha, adiciona um espaço após cada dois pontos e organiza as listas de selectores de forma limpa. Escolha indentação de 2 espaços, 4 espaços ou tabulações para corresponder ao estilo do seu projecto.

Como minificar e embelezar são reversíveis, pode colar CSS minificado de produção, lê-lo, ajustá-lo e minificá-lo novamente — tudo sem sair da página.

Como se compara com cssminifier.com, CleanCSS e cssnano

cssminifier.com é a opção online mais usada, mas carrega o seu código para os seus servidores. Para folhas de estilo proprietárias — projectos de clientes, designs não publicados, ferramentas internas — isso é um risco real. CleanCSS e cssnano são bibliotecas Node.js: ideais para pipelines automatizados mas indisponíveis sem instalação local. O minificador CSS do freeformatter.com e o do TopTal são também do lado do servidor.

Esta ferramenta processa tudo localmente com JavaScript — nada é carregado, nunca. Cobre as optimizações de minificação mais comuns (espaços, comentários, pontos e vírgulas, unidades zero, zeros iniciais) e adiciona uma estimativa gzip no mesmo passo. Sem conta, sem upload, sem instalação — funciona em iPhone, Android, Mac, Windows e Linux.

Veja os bytes que poupa — incluindo gzip

Uma barra de estatísticas proeminente reporta o tamanho original, o tamanho de saída e os bytes e percentagem poupada, para que saiba sempre exactamente quanto mais pequeno ficou o seu CSS. Os tamanhos são medidos em bytes UTF-8 reais, não em contagens de caracteres, pelo que correspondem ao que o seu servidor realmente serve.

Também mostra uma cifra gzipada calculada localmente no seu browser. A minificação e o gzip somam-se — minifique a fonte, depois deixe que o seu servidor a comprima — e ver ambos os números torna óbvio o ganho combinado.

100% privado — nada sai do seu browser

Cada minificação e embelezamento executa localmente no seu browser usando JavaScript. O seu CSS nunca é carregado, registado ou armazenado, o que torna este um lugar seguro para comprimir folhas de estilo proprietárias, não publicadas ou de clientes. Não há registo e não há limite para além da memória do seu dispositivo. Também funciona offline — uma vez carregada a página, desconecte a internet e o minificador continua a funcionar. Marque este minificador CSS online e recorra a ele sempre que precisar de comprimir CSS, reduzir um ficheiro ou ler um minificado.