Minificador de CSS
Minifica CSS no navegador.
Sobre esta ferramenta
O minificador remove comentários e espaços desnecessários para diminuir o tamanho do ficheiro CSS. É prático para verificações rápidas, já que o build de produção costuma minificar no empacotador.
Como usar
Cole CSS legível, execute Minificar e compare o número de bytes antes e depois. O artefacto final do release deve continuar a sair da sua pipeline.
Exemplo
O exemplo traz um comentário que a minificação apaga.
Entrada
.hero {
/* homepage band */
padding: 4rem 1.5rem;
background: #0f172a;
color: #e2e8f0;
}Saída
.hero{padding:4rem 1.5rem;background:#0f172a;color:#e2e8f0}Dica
Nunca guarde apenas a versão minificada: o ficheiro formatado tem de permanecer no repositório.
Bom saber
Quanto mais pequeno fica o meu CSS?
Depende da quantidade de espaços e comentários no original — CSS muito comentado e indentado é o que mais encolhe. Esta ferramenta só remove espaços e comentários; um minificador de build também pode juntar e encurtar regras, por isso use-o na versão final.
Minificar pode estragar os meus estilos?
Os espaços em seletores descendentes como “nav :first-child” são mantidos, porque removê-los mudaria o significado. Os comentários são removidos, incluindo cabeçalhos de licença.