Minificador & Embelezador de CSS

Cole uma folha de estilos e obtenha-a de volta comprimida para o menor tamanho seguro ou expandida em código limpo e indentado. A mesma ferramenta funciona em ambas as direções, para que você possa minificar uma folha de estilos para produção e desminificar um arquivo de fornecedor que precisa ler — sem sair da página.

Como usar

1. Cole seu CSS na caixa de entrada ou envie um arquivo .css.
2. Escolha um Formato:
   • Minificar — tudo em o menor número de bytes possível.
   • Minificar, mas manter quebras de linha — declarações minificadas, uma regra por linha. Útil quando você ainda quer comparar a saída ou ler um rastreamento de pilha contra ela.
   • Embelezar — reindente e expanda a folha de estilos. Escolha 2 espaços, 4 espaços ou abas.
3. Copie o resultado ou baixe como um arquivo .css.

A saída é atualizada conforme você digita. Nada é enviado para lugar algum — veja a nota de privacidade abaixo.

O que minificar realmente remove

Comentários e cada sequência de espaço em branco que a gramática CSS possivelmente não precisa. As declarações se tornam color:red, o último ; antes de } é solto, !important perde seu espaço inicial e os combinadores de seletor se apertam (a > b + i se torna a>b+i).

O que deliberadamente não toca é igualmente importante:

• Strings permanecem idênticas em bytes. content: "/* not a comment */" é uma string, não um comentário, e sai intacto.
• Valores url() são opacos — incluindo URIs data: sem aspas repletos de ; e , que um minificador regex ingênuo dividiria pela metade.
• calc() mantém seus espaços. calc(100% - 10px) é válido; calc(100%-10px) é um erro de sintaxe. Os espaços em torno de + e - dentro de um valor são críticos e são preservados.
• Combinadores descendentes sobrevivem. p :first-child (cada primeiro filho dentro de um p) não é o mesmo seletor que p:first-child (um p que é um primeiro filho). O espaço entre eles é mantido.
• Comentários /*! … */ bang são mantidos, que é como cabeçalhos de licença são convencionalmente marcados.

Ele renomeia classes ou reescreve minhas propriedades?

Não. Esta é uma ferramenta minificadora de espaço em branco e comentários, não um otimizador. Não irá mesclar regras duplicadas, soltar vazias, encurtar #ffffff para #fff ou reordenar qualquer coisa. A saída é sempre uma folha de estilos que se comporta exatamente como a entrada — uma saída menor nunca vale a pena silenciosamente alterar o que seu CSS faz.

Quanto menor meu CSS ficará?

Tipicamente 20–35% em CSS escrito manualmente, principalmente a partir de indentação e comentários. CSS já minificado mal se moverá. Servir o resultado com compressão gzip ou brotli lhe dá muito mais do que minificação, então faça os dois.

Posso desminificar uma folha de estilos?

Sim — é para isso que Embelezar serve. Cole CSS minificado, escolha sua indentação e você obtém uma folha de estilos legível de volta. Comentários que sobreviveram à minificação original são mantidos e colocados em suas próprias linhas.

Por que minha regra vazia permaneceu?

Porque remover regras é uma mudança estrutural e a ferramenta só funciona com espaço em branco e comentários. .unused {} é inofensivo; se você quer que desapareça, delete na sua fonte.

Meu CSS é enviado para algum lugar?

Não. O minificador funciona inteiramente no seu navegador — sua folha de estilos nunca é enviada para um servidor, nunca é registrada e nunca é armazenada. Enviar um arquivo o lê localmente na página. Você pode desconectar da rede e a ferramenta ainda funciona.