Herramientas · CSS · Minificador y formateador de CSS
Minificador y formateador de CSS
Minifica o formatea CSS, en vivo mientras pegas, completamente en tu navegador.
Añade un archivo y ejecuta la herramienta.
Tu archivo está listo.
Prueba otro archivo, o inténtalo de nuevo.
Ajustes
Ajusta la configuración de abajo. El resultado se actualiza sobre la marcha.
Funciona por completo en tu navegador. No se sube ningún archivo.
Funciona por completo en tu navegador. Nada se sube nunca a un servidor.
Cómo funciona
Pega tu CSS, o empieza desde el ejemplo que ya aparece en el cuadro.
Elige Minificar o Formatear, y un tamaño de sangría para Formatear.
Copia el resultado.
Preguntas frecuentes
No. Tanto minificar como formatear se ejecutan por completo en tu navegador.
No. Es un tokenizador real, no una expresión regular que elimina espacios - rastrea los límites de comentarios, cadenas y url(), y copia su contenido tal cual, espacios incluidos. content: "a b" y url("x?a=1 b=2") salen exactamente como los escribiste.
Se muestra en vivo como un porcentaje real, calculado a partir del tamaño real en bytes de tu entrada y salida - no es una cifra fija. Depende de cuántos espacios y comentarios tenga el original.
Aun así produce un resultado lo mejor posible, junto con una nota clara de que las llaves parecían desequilibradas - no lanza un error ni se niega a funcionar.
Guías
Una mirada más de cerca a problemas concretos que resuelve esta herramienta.
Why Minify CSS, and Why a Whitespace Regex Is the Wrong Way to Do It
Minifying CSS removes bytes a browser has to wait for before it paints anything. Doing it with a find-and-replace on whitespace is how valid CSS turns into a stylesheet the browser silently ignores.
Leer la guíaHow to Minify CSS Without Breaking It
Paste a stylesheet, keep the mode on Minify, and copy the result. This walks through what the tool removes, the two options that keep things, and how to read the byte counts it shows.
Leer la guíaHow to Beautify Minified CSS So You Can Debug It
A production stylesheet is one long line. Beautify mode turns it back into one declaration per line so you can find the rule that is overriding yours. It cannot bring back comments that were already removed.
Leer la guía
Comentarios