Minimizador de CSS
Minimiza y comprime CSS para reducir el tamaño del archivo.
Acerca del minimizador de CSS
El minimizador de CSS elimina comentarios, colapsa los espacios en blanco y suprime los caracteres innecesarios para producir el CSS válido más compacto posible. El modo de embellecimiento hace lo contrario — toma CSS minificado o sin formato y añade sangría y saltos de línea consistentes para facilitar la lectura. Todas las operaciones se realizan completamente en tu navegador.
Preguntas frecuentes
- ¿Cuánto se puede comprimir el CSS?
- Típicamente una reducción del 20–50 % dependiendo de cuántos espacios en blanco y comentarios existen en el original.
- ¿El CSS minificado es CSS válido?
- Sí. La minificación solo elimina espacios en blanco y comentarios, que no tienen efecto en la renderización.
- ¿Puedo minimizar CSS con prefijos de proveedor?
- Sí. Las propiedades con prefijos de proveedor como -webkit- y -moz- se conservan exactamente como están.
ACERCA DE ESTA HERRAMIENTA
Paste your CSS and the tool strips whitespace, line breaks, and comments, and removes unnecessary characters like trailing semicolons, shortening the file without altering the rules themselves. This is purely a size reduction step - your selectors, property values, specificity, and cascade order all stay exactly the same, so minifying never changes how a page looks. It's a standard step before shipping CSS to production: smaller stylesheets download and parse faster, and are one of the factors affecting Core Web Vitals metrics like Largest Contentful Paint, especially on slower mobile connections where every kilobyte of render-blocking CSS delays first paint.
CÓMO USARLO
- Paste your full CSS file or a snippet into the input box.
- Run the minifier to strip whitespace, comments, and redundant characters.
- Compare the before and after size if you want to confirm the reduction.
- Copy the minified output into your production stylesheet.
- Keep your original, readable CSS in source control - minify only the build output, not the file you edit.
CASOS DE USO COMUNES
- A developer preparing a vanilla CSS file for production on a small site without a build pipeline like Vite.
- Someone shrinking a large third-party CSS file before self-hosting it to cut a few kilobytes off page weight.
- A developer inlining critical CSS into the head for above-the-fold content and wanting it as compact as possible.
- Someone comparing file size before and after removing unused rules, to gauge the impact of a CSS cleanup pass.
- A student learning what minification actually does by comparing readable CSS against its compacted output.
CONSEJOS Y ERRORES COMUNES
- Minification never changes selectors, specificity, or the cascade - if a bug appears after minifying, it was already present in the original, just harder to spot.
- Comments meant as documentation for other developers are removed entirely, so don't treat the minified version as your working source file.
- CSS custom properties and calc() expressions are preserved functionally, though whitespace inside calc() may be adjusted since some browsers require specific spacing around operators.
- Pair minification with gzip or brotli compression on the server for real production gains - the two stack, since compression handles repetitive patterns minification alone can't.
MÁS PREGUNTAS
- Does minifying CSS remove unused rules or dead code?
- No, minification only compresses formatting. Removing unused selectors requires a separate tool like PurgeCSS that analyzes your actual HTML or JS to determine which rules ever get applied.
- Can minified CSS break browser hacks that rely on whitespace or comment syntax?
- It's rare with modern CSS, since legacy comment-based hacks mostly targeted old versions of Internet Explorer and aren't part of code written for current browsers.
- How much smaller does CSS typically get after minification?
- It varies a lot by how verbose the original formatting was, but heavily commented, indented CSS commonly shrinks 20-40% in raw size before any server compression is applied.
- Is it fine to edit minified CSS directly for a quick fix?
- Technically yes, but it's a bad idea - single-line minified CSS is extremely hard to read and edit safely, so edit the original source and re-minify rather than patching the compressed output.