Reduza o tamanho do seu CSS
Cada byte de CSS precisa ser baixado e processado antes que uma página seja renderizada, então folhas de estilo menores significam um carregamento mais rápido, melhores Core Web Vitals e menos uso de dados móveis. Este minificador de CSS remove espaços em branco e comentários e aplica otimizações estruturais — mesclando regras duplicadas, encurtando cores e removendo valores redundantes — para que sua folha de estilo fique o menor possível sem alterar o visual da página.
Recursos
- Remoção de espaços em branco e comentários.
- Encurtamento de valores: cores, zeros, unidades e pesos de fonte.
- Otimização estrutural: mescla seletores duplicados e remove declarações sobrescritas.
- Comentários de licença (
/*! … */) mantidos, se solicitado. - Comparação de tamanho em bytes e porcentagem.
- Privado: roda totalmente no seu navegador.
Antes e depois
.card .title {
font-weight: bold;
color: #333333;
}
.card .title {
font-size: 1.25em;
}
se torna
.card .title{font-weight:700;color:#333;font-size:1.25em}
Quando minificar
Minifique o CSS como parte do seu processo de build para produção e mantenha o código-fonte legível no controle de versão. A maioria dos frameworks e bundlers faz isso automaticamente; esta ferramenta é útil para correções rápidas, temas de CMS, templates de e-mail, widgets incorporados e projetos sem uma etapa de build.
Ferramentas relacionadas
Minifique scripts com o Minificador de JavaScript, crie estilos visualmente com o Gerador de Box Shadow e o Gerador de Gradiente CSS, ou formate JSON com o Formatador de JSON.