Ordene una hoja de estilos o minifíquela, con el tamaño ahorrado a la vista
Se ejecuta en su navegador. Nada de lo que escribe se envía a ningún sitio.Formatear CSS lo sangra para que la hoja de estilos se pueda leer, y minificarlo elimina cada espacio y comentario para producción. Se muestran los bytes ahorrados, así que la ganancia en un archivo de 2 KB se ve antes de decidir. Todo se ejecuta en su navegador y no se sube nada.
Esta página se ha traducido automáticamente del original en inglés. Ninguna persona ha revisado todavía la traducción, así que la versión en inglés es la que debe consultar. Leer el original en inglés
Pegue la hoja de estilos en el cuadro CSS o pulse Probar un ejemplo.
Deje Embellecer para una declaración por línea, o elija Minificar para el archivo más pequeño.
Con Embellecer, elija 2 espacios, 4 espacios o Tab en Sangría.
Pulse Copiar o Descargar para llevarse el resultado.
Este formateador de CSS tiene dos modos. Embellecer organiza una hoja de estilos con una declaración por línea, una sangría uniforme y un espaciado coherente alrededor de los dos puntos y las llaves. Minificar elimina comentarios y espacios en blanco, acorta colores y unidades, y puede fusionar reglas que comparten el mismo bloque; después muestra el tamaño antes, el tamaño después y el porcentaje ahorrado.
Se usa en los dos extremos de un trabajo. Al principio, una hoja de estilos llega minificada desde un CDN o una compilación y necesita leer la regla que causa un problema de diseño. Al final, tiene un archivo escrito a mano y quiere la versión más pequeña para publicar. Aquí ambas cosas son pegar y hacer un clic.
La minificación usa csso. La opción de reestructurar es la parte agresiva: fusiona reglas con bloques idénticos, elimina declaraciones que una regla posterior anula y reordena donde es seguro. Suele ahorrar unos puntos porcentuales más y el resultado es equivalente, pero si está revisando un diff o su CSS depende del orden del código de formas que una herramienta no puede ver, desactívela y solo desaparecerán los espacios y los comentarios. Los comentarios que empiezan con un signo de exclamación, que es donde viven las cabeceras de licencia, se pueden conservar.
Sobre el resultado obtiene el número de reglas, selectores, declaraciones y reglas @. Si queda abierta una llave, un comentario o una comilla, obtiene la línea y la columna donde empezó y qué añadir, en lugar de un volcado del analizador. Todo se ejecuta en su navegador, así que una hoja de estilos de un proyecto no publicado nunca se sube a ningún sitio.
Sí. Sin registro, sin límite de tamaño de archivo y sin tope de cuántas hojas de estilos procesa. La página se financia con unos pocos anuncios mostrados fuera de la herramienta, y su resultado nunca se ve afectado por ellos.
No. Tanto embellecer como minificar se ejecutan en su navegador con JavaScript. Una hoja de estilos de un diseño no publicado o de una herramienta de administración interna nunca sale de su dispositivo, y no se guarda nada al cerrar la pestaña.
Una hoja de estilos escrita a mano, con comentarios y sangría, suele bajar entre un 15 y un 30 por ciento, y reestructurar añade un par de puntos más al fusionar reglas duplicadas. La página muestra el número exacto de bytes antes y después, así que nunca tiene que adivinar.
Reestructurar fusiona reglas que tienen bloques idénticos, elimina declaraciones que una regla posterior anula y reordena selectores donde es seguro. El ahorro adicional suele ser de unos pocos puntos porcentuales sobre la minificación simple. Desactívela cuando quiera quitar solo espacios y comentarios, por ejemplo cuando necesita un diff legible entre dos compilaciones.
Sí. Elija Embellecer y pegue el archivo minificado. Vuelve con un selector por línea, una declaración por línea y las media queries sangradas dentro de su bloque. Los nombres de los selectores, los valores y el orden quedan exactamente como estaban.
Minificar no debería romper una hoja de estilos válida. csso analiza el CSS correctamente en lugar de sustituir texto, así que las cadenas, los data URI y las propiedades personalizadas se conservan. Si el archivo no se puede analizar, obtiene la línea y la columna en lugar de un resultado roto, y no se copia nada.
¿Sigue sin resolverlo? Pregunte sobre Formateador y minificador de CSS y cualquiera que lo sepa puede responder. No se necesita cuenta.