Todo se hace en tu navegador: el código que pegas o abres no se sube a ningún sitio.
Integra esta herramienta en tu web
Gratis y sin cuenta: copia el código y pégalo en tu web, tu blog o tu documentación.
Sobre el minificador de CSS y JavaScript
Reduce el peso de una hoja de estilos o de un script antes de publicarlo, o vuelve legible un archivo minificado. Pega el código o suelta un archivo, elige Minificar o Embellecer y el resultado aparece mientras escribes, con los bytes ahorrados. El JavaScript pasa por Terser, el minificador que usan casi todas las herramientas de compilación; el CSS se minifica sin reescribir ni un solo valor. No se sube nada: todo se hace en tu navegador.
Cómo usar el minificador de CSS y JavaScript
-
Pega o abre tu código
Pega CSS o JavaScript en Entrada, o suelta un archivo .css, .js o .mjs. El lenguaje se elige según el archivo o lo que pegas; cambia entre CSS y JavaScript si no acierta.
-
Elige Minificar o Embellecer
Minificar quita comentarios y espacios; en JavaScript, «Acortar nombres de variables» y «Módulo ES» deciden hasta dónde llega Terser, y «Conservar comentarios de licencia» mantiene las notas /*! y @license. Embellecer vuelve a dar formato al código con 2 espacios, 4 espacios o tabuladores.
-
Revisa y copia
Mira el tamaño original, el del resultado y el porcentaje ahorrado. Si hay un error de sintaxis, corrígelo en la línea y la columna que se indican. Después copia el resultado o descárgalo como .min.css o .min.js.
Casos de uso
Archivos más ligeros sin herramientas de compilación
Minifica una hoja de estilos o un script para una web sin empaquetador, como un tema de WordPress, una landing page o un fragmento que pegas en un CMS, para que los visitantes descarguen menos bytes.
Leer código minificado
Embellece un .min.js o un .min.css de una biblioteca, una CDN o una web que estás depurando para ver su estructura con saltos de línea y sangría.
Medir el ahorro
Comprueba cuántos bytes quita la minificación a un archivo antes de decidir si merece la pena añadir un paso de minificado a tu publicación.
Preguntas frecuentes
¿Minificar cambia cómo funciona mi CSS?
No. El minificador de CSS solo quita los comentarios, los espacios que no significan nada y el último punto y coma de cada bloque. Conserva los espacios que CSS necesita, como el que separa .a y .b en un selector descendiente, los de alrededor de + y - dentro de calc() y los de los valores de las propiedades personalizadas, y nunca toca los textos entre comillas ni url(). Tampoco fusiona reglas ni acorta colores, así que ahorra menos que las herramientas que reescriben valores, pero el resultado funciona exactamente igual que el original.
¿Qué hace «Acortar nombres de variables»?
Es el paso «mangle» de Terser: las variables locales y los parámetros de las funciones pasan a tener nombres de una o dos letras. Los nombres globales no se tocan salvo que actives Módulo ES, porque otros scripts de la página pueden usarlos. Desactívalo si quieres nombres legibles en el archivo minificado; la compresión se sigue haciendo.
¿Cuándo debo activar Módulo ES?
Cuando el código usa import o export, o await fuera de una función. En un módulo, los nombres del nivel superior son privados, así que Terser también puede acortarlos y quitar los que no se usan. Si el código solo se puede leer como módulo, la herramienta te lo dice y te ofrece activar la opción.
¿Embellecer me devuelve el código original?
Te devuelve la forma, no los nombres ni los comentarios. Embellecer añade saltos de línea y sangría, pero las variables que un minificador acortó siguen con su nombre corto y los comentarios eliminados no vuelven. Solo un source map relaciona el código minificado con su original.
¿Se sube mi código?
No. Minificar y embellecer se hace en tu navegador; Terser y el formateador se cargan en la página la primera vez que los usas. El código se guarda en el almacenamiento local de tu navegador (hasta unos 200 000 caracteres) para que siga ahí cuando vuelvas; Borrar lo elimina.
Herramientas relacionadas
Explora todas las herramientas online gratis de Tooly: todas funcionan en tu navegador y ninguna necesita cuenta.