Formateador y minificador de CSS

Cómo usar

1. 1 Pega tu CSS.
2. 2 Elige Embellecer para obtener un resultado con sangría fácil de leer, o Minificar para eliminar espacios en blanco y comentarios.
3. 3 Copia o descarga el resultado.

Por qué usar esta herramienta

• Utiliza la librería js-beautify.
• Admite ambas direcciones — embellecer CSS ya minificado o minificar CSS ya formateado.
• Procesamiento totalmente en el cliente, sin subidas.
• El modo de embellecer coloca cada selector en su propia línea, lo que da un resultado amigable con git diff.

Preguntas frecuentes

¿Qué es Formateador y minificador de CSS?

CSS Formatter es una herramienta para embellecer (beautify) o minificar (minify) reglas CSS. El modo de embellecer aplica sangría a selectores, propiedades y declaraciones para obtener una estructura ordenada y fácil de leer, mientras que el modo de minificar elimina espacios en blanco y saltos de línea para reducir el tamaño del archivo CSS. La herramienta funciona completamente en el navegador, sin necesidad de registro ni de subir archivos a un servidor — todo el procesamiento de CSS ocurre localmente en tu dispositivo.

Características

Ejemplo

body{margin:0;color:#fff}

body {
  margin: 0;
  color: #fff;
}

Casos de uso comunes

1. 1

   Formatear CSS comprimido

   Expande una hoja de estilo minificada para poder leerla y editarla.

2. 2

   Aplicar un estilo uniforme

   Normaliza el espaciado y las mayúsculas/minúsculas en el CSS de todo el equipo.

3. 3

   Reducir antes de publicar

   Minifica una hoja de estilo para recortar bytes en la ruta crítica de carga.

Cómo se compara Formateador y minificador de CSS con otras alternativas

Referencias

• CSS Syntax Module Level 3 — W3C CSSWG
• js-beautify — embellecedor de código para HTML/CSS/JS — GitHub
• CSS: Cascading Style Sheets — MDN — MDN

Herramientas relacionadas