Minificador CSS
Minifica CSS con CSSO: elimina espacios y comentarios, acorta colores y valores y fusiona reglas de forma segura. Muestra los bytes ahorrados. Gratis y en tu navegador.
Se ejecuta completamente en tu navegador. Tus datos nunca se suben.
Herramientas Relacionadas
Ver Todas¿Qué es Minificador CSS?
El Minificador CSS comprime hojas de estilo con CSSO, un optimizador estructural. Además de eliminar espacios y comentarios, acorta valores (#ff0000 → red, 0px → 0), fusiona reglas duplicadas y elimina declaraciones redundantes cuando eso no puede cambiar el resultado.
Cómo usar Minificador CSS
- Pega tu CSS en el cuadro de entrada.
- Haz clic en Minificar (la salida también se actualiza mientras escribes).
- Revisa la línea de tamaño para ver el ahorro.
- Copia o descarga el CSS minificado.
Ejemplo
a { color: #ff0000; margin: 0px 0px; } /* c */ a{color:red;margin:0} Cuándo usar Minificador CSS
Úsalo para builds de producción de sitios pequeños, bloques <style> en línea o CSS guardado en un CMS. Si tu build ya usa un bundler con cssnano/lightningcss, sigue usándolo. Conserva a mano los comentarios de licencia si tu licencia lo exige.
Cómo funciona Minificador CSS
Primero, un análisis rápido revisa llaves, cadenas y comentarios, y señala los bloques desbalanceados con su posición. Después el CSS se pasa a csso.minify con la reestructuración activada: CSSO lo convierte en un AST (css-tree), aplica compresiones de valores seguras y fusión de reglas, e imprime el resultado sin espacios. Los comentarios se eliminan, incluidos los comentarios de licencia /*! … */.
Casos de Uso Comunes
- Minificar una hoja de estilo independiente para una landing page
- Reducir el CSS crítico antes de incrustarlo en línea
- Comprimir CSS guardado en una base de datos o un CMS
- Comparar el tamaño optimizado con el original
Nota de Seguridad
Todo se ejecuta localmente en tu navegador; el código que pegas no se sube a ningún servidor.
Preguntas Frecuentes
¿La minificación puede romper mi CSS?
CSSO solo aplica transformaciones que mantienen el mismo resultado de la cascada, pero prueba siempre la salida.
¿Por qué #ff0000 se convirtió en red?
red es más corto y significa exactamente el mismo color.
¿Se conservan los comentarios de licencia?
No, se eliminan todos los comentarios. Vuelve a añadir la licencia a mano si es necesario.