Embellecedor y minificador de CSS

Formatee o minifique CSS, SCSS y LESS con errores precisos y estadísticas de tamaño.

Funciona en local · no se sube nada
Input
Output

Qué hace

Convierta una hoja de estilos minificada o un archivo SCSS desordenado en código legible con una declaración por línea, o reduzca una hoja de estilos para producción. La salida se actualiza mientras escribe.

Funciones

  • CSS, SCSS y LESS: se entienden el anidamiento, las variables, los mixins, los mapas, @use, las guardas y la interpolación #{} / @{}.
  • Formato con Prettier con 2 espacios, 4 espacios o tabuladores, ancho de línea y comillas simples o dobles.
  • Minificar elimina los comentarios, salvo los de licencia /*! ... */, y el espacio en blanco allí donde no importa: alrededor de { } ; ,, después de : y (, antes de !important y alrededor de los combinadores > + ~ de los selectores. También desaparece el último punto y coma de cada bloque. Todo lo demás se copia sin cambios, de modo que las cadenas, los valores url(), los escapes como .md\:flex, calc(1px + 2px) y los selectores descendientes como .a :hover conservan su significado. En SCSS y LESS también se eliminan los comentarios de línea //.
  • Errores precisos: un bloque sin cerrar, una comilla que falta o una } sobrante se indican con su línea y columna, un fragmento con un indicador y el botón Ir al error.
  • Tamaño antes y después, número de líneas y tiempo. Al abrir un archivo .scss o .less, el lenguaje cambia automáticamente.

Cómo usarlo

  1. Pegue una hoja de estilos, abra un archivo o suéltelo sobre la entrada. Ejemplo carga una muestra.
  2. Elija el lenguaje y después Formatear o Minificar.
  3. Copie o descargue el resultado. Ctrl+Enter lo ejecuta al instante.

El minificador no fusiona reglas, no acorta colores ni reescribe valores; para ese nivel de optimización use una herramienta de compilación como cssnano o Lightning CSS. El SCSS y el LESS minificados siguen siendo SCSS y LESS: compílelos antes de publicarlos.

Privacidad

Todo se ejecuta en su navegador; solo se descargan de un CDN los archivos de Prettier con versión fija. Sus estilos nunca se suben a ningún servidor. La última entrada se guarda en el almacenamiento local para que una recarga no la pierda.