RevealTheme logo

Minificador de CSS

Elimina comentarios, espacios en blanco y caracteres innecesarios del CSS para reducir el tamaño del archivo.

Cómo usar esta herramienta

  1. 1

    Paste your CSS — a single rule, a component stylesheet, or an entire file.

  2. 2

    The minified result and the byte savings appear instantly below the input.

  3. 3

    Copy the minified output, or compare the before/after byte count to see the reduction.

¿Qué es el Minificador de CSS?

El CSS minificado se carga más rápido: cada byte cuenta en la ruta de renderizado crítica. La minificación elimina los comentarios, colapsa los espacios en blanco y simplifica la sintaxis (por ejemplo, 'color: #ffffff' se convierte en 'color:#fff'). Para sitios en producción, usa un minificador en tiempo de compilación como cssnano; esta herramienta es para fragmentos de CSS puntuales.

Casos de uso comunes

  • Shrink a critical-CSS snippet you're inlining into the <head> to remove a render-blocking request.

  • Compress CSS for an HTML email or newsletter, where every kilobyte counts and there's no build pipeline.

  • Paste CSS into a CMS or page-builder field that doesn't minify automatically (WordPress 'Additional CSS', Shopify theme settings).

  • Check how much weight a third-party stylesheet adds before deciding whether to self-host it.

  • Clean up CSS copied from DevTools, which arrives with computed-style comments and inconsistent spacing.

  • Produce a one-line version of a rule to paste into a chat, ticket, or code-review comment.

Preguntas frecuentes

¿La minificación romperá mi CSS?
No: la minificación conserva la semántica. Si tu CSS se rompe, el origen tenía errores de sintaxis que el navegador toleraba pero el minificador no.
¿Cuánta reducción de tamaño puedo esperar?
Entre el 20 % y el 40 % en CSS escrito a mano típico. Menos en CSS ya comprimido de frameworks.

Herramientas relacionadas