Output will appear here...CSS Minifier & Beautifier es una herramienta de hoja de estilo bidireccional: comprime CSS eliminando todo lo que el navegador no necesita: comentarios, espacios en blanco, punto y coma redundantes, colores hexadecimales de formato largo y unidades en valores cero, y puede revertir el proceso, expandiendo un paquete de producción de una sola línea en reglas legibles y correctamente sangradas. Cada byte que elimina de una hoja de estilo de bloqueo de render es un byte que el navegador descarga y analiza antes, que alimenta directamente las métricas principales de Web Vitals, como la primera pintura contentful y la pintura más grande de contenido.
El minifiser es deliberadamente conservador. Es plenamente consciente de los literales de cadena, valores de URL() y expresiones de calc(), por lo que nunca elimina el espacio en blanco del que depende Calc(100% - 20px), nunca reescribe texto similar al color dentro de una cadena de contenido y nunca toca el espacio que distingue div :hover de div:hover. En las hojas de estilo típicas escritas a mano, puede esperar una reducción de tamaño del 25 al 40% antes de GZIP; combinado con GZIP o Brotli en el cable, la minificación aún afeita un corte significativo porque la compresión funciona mejor en la entrada repetitiva y sin comentarios.
Todo se ejecuta al 100% del lado del cliente en su navegador. Su CSS nunca se carga, registra o almacena en ningún servidor, lo que significa que puede pegar de forma segura el código del sistema de diseño, los estilos de producto inéditos o el trabajo del cliente. También funciona sin conexión una vez que se carga la página: útil cuando necesita un pase de minify rápido sin cablear una canalización postCSS completa o ESBuild.
Suelte su hoja de estilo en el área de entrada: una sola regla, un archivo de componentes o un paquete de producción completo. Se aceptan CSS tanto formateados como ya minificados.
Haga clic en Minify para comprimir para la producción, o embellece para expandir el código minimizado en una declaración por línea con una línea en blanco entre reglas. Para embellecer, elija su sangría preferida primero.
La herramienta informa el cambio de tamaño exacto antes/después y porcentual (por ejemplo, "12,4 KB → 8,1 KB, −34%"), por lo que sabe con precisión qué le compró la transformación antes de enviarla.
Copie el resultado en su portapapeles con un solo clic o descárguelo como un archivo .css listo para colocar en su salida de compilación o CDN.
Respeta los literales de cadena, los valores de url() y el espaciado de calc(): se comprime agresivamente sin corromper nunca css válido
Reescribe #ffffff a #fff y 0px a 0 donde probablemente sea seguro, exprimiendo bytes adicionales más allá de la eliminación de espacios en blanco simple
Mantiene /* Comentarios de banner intactos para que los encabezados de la licencia de la biblioteca sobrevivan la minificación, igualando el comportamiento estándar de la herramienta de compilación
Amplía los paquetes minimizados en reglas legibles con una sangría de espacio configurable de 2, 4 u 8 para depurar problemas de producción
Minify HTML markup for faster page loads or beautify it for readable, indented source
Format messy SQL into readable, indented queries or minify SQL to a single line
Format, validate, and minify JSON data
Create beautiful CSS gradients with live preview
0 comments
No comments yet. Be the first to share your thoughts!