Minificador y embellecedor de CSS
Reduce el peso de tus hojas de estilo eliminando comentarios, espacios y reglas vacías, o haz lo contrario: convierte CSS minificado en código legible con sangría. Verás el tamaño original, el final y el tamaño comprimido con gzip.
Procesado 100% en tu navegador
Ctrl + Enter ejecutarCtrl + C copiar resultado
Cómo usar
- 1Pega tu CSS, arrastra un archivo .css o carga el ejemplo.
- 2Elige «Minificar» o «Embellecer» y ajusta las opciones (licencias, optimización, sangría).
- 3El resultado se actualiza al instante junto con el ahorro en bytes y con gzip.
- 4Copia el resultado o descárgalo como archivo .css.
Casos de uso
- Preparar CSS para producción y mejorar las Core Web Vitals.
- Leer y depurar el CSS minificado de una web o de una librería.
- Medir cuánto pesa realmente una hoja de estilos al servirla comprimida.
- Limpiar CSS heredado: quitar comentarios y reglas vacías.
Preguntas frecuentes
¿Qué hace exactamente la minificación de CSS?
Elimina comentarios, espacios, saltos de línea, el último punto y coma de cada bloque y las reglas vacías, y acorta valores como #aabbcc → #abc o 0.5 → .5. El navegador interpreta el CSS exactamente igual, pero el archivo pesa menos.
¿Puede romper mi CSS?
Está diseñado para no hacerlo: el texto entre comillas, las url() y los espacios de calc() se conservan intactos, y no se tocan los espacios de los selectores descendientes (por ejemplo «a :hover»). Aun así, revisa el resultado antes de publicarlo.
¿Por qué conservar los comentarios /*! … */?
Por convención, los comentarios que empiezan por /*! contienen avisos de licencia (MIT, Apache…) que muchas licencias obligan a mantener incluso en código minificado.
¿Qué significa el tamaño «con gzip»?
Es el tamaño aproximado que viajará por la red si tu servidor comprime con gzip, calculado en tu navegador con CompressionStream. Es la cifra que realmente afecta a la velocidad de carga.