piapia123
es

Minificador y embellecedor de CSS

Web

Todo se ejecuta en tu navegador: no se sube nada

Entrada
Arrastra un archivo aquí para cargarlo
Resultado

Comprime CSS a una línea, o vuelve a sangrarlo en líneas legibles, y obtén el número de reglas, declaraciones y selectores además de los bytes antes y después con el ahorro. Usa un pequeño escáner carácter a carácter en lugar de borrar con expresiones regular — la llave en `content: "}"`, el punto y coma en `url("a;b.png")` y la coma en `[data-x="a,b"]` se dejan intactos. En el modo de minificar, el punto y coma tras la última declaración se quita por defecto y se puede conservar; los comentarios pueden irse o quedarse (los de licencia `/*!` siempre se conservan). Todo se ejecuta en el navegador.

Funciones

  • Tres modos: minificar, embellecer, solo estadísticas
  • Embellecer con sangría de 2 espacios, 4 espacios o tabulador
  • Recuentos de reglas, declaraciones y selectores
  • Bytes antes y después, más el ahorro
  • Conservar o quitar el punto y coma tras la última declaración
  • Quitar comentarios si quieres; los de licencia `/*!` siempre se conservan
  • Las llaves, puntos y coma y comas dentro de cadenas, comentarios, url() y corchetes nunca se tocan
  • Se conserva la diferencia entre `a :hover` y `a:hover`
  • Copia todo el resultado, o copia una fila de estadísticas suelta

Cómo se usa

  1. Pega o arrastra CSS en el cuadro
  2. Elige un modo y luego ajusta la sangría, el punto y coma y los comentarios
  3. La salida y las estadísticas se actualizan según escribes
  4. Copia el CSS procesado, o toma los números por separado

Preguntas frecuentes

¿Por qué no minificar simplemente con expresiones regular?
Porque en CSS los caracteres `{};:,` son a menudo datos y no estructura: la llave en `content: "}"` es contenido de cadena, el punto y coma en `url(a;b.png)` pertenece a la URL y la coma en `[data-x="a,b"]` está dentro de un selector. Una expresión regular los cortaría y produciría una hoja de estilos que parece correcta pero ya no significa lo mismo — y además suele seguir analizándose, así que el error solo se ve como un renderizado equivocado. Por eso la herramienta usa un pequeño escáner carácter a carácter.
¿El modo de solo estadísticas se salta el cálculo del CSS minificado?
Sí lo calcula. Tanto el recuento de bytes como el ahorro se miden sobre el resultado minificado — simplemente no muestra ese CSS, para que puedas ver cuánto ahorrarías sin una pantalla llena de salida densa.
¿Quitar comentarios borrará el aviso de licencia?
No. Un comentario que empieza por `/*!` es la convención del sector para un aviso de licencia y se conserva tanto si marcas quitar comentarios como si no.
¿Se sube el CSS?
No. La tokenización, la minificación y el recuento se ejecutan en el navegador, y la página no hace ninguna petición.

Herramientas relacionadas

Formateador CSS

Formato

Formatea CSS en línea: una declaración por línea y cada selector de la lista en la suya. El minificador solo quita el espacio estructural.

Unidades CSS

Conversión

Convierte una longitud CSS entre px, rem, em, vw, vh y más. El tamaño de fuente raíz y el viewport son ajustables, y cada fila dice qué supuso.

Formateador HTML

Formato

Formatea HTML en línea por niveles de etiqueta, manteniendo el texto y las etiquetas en línea en la misma línea y el contenido de script o pre intacto.

Analizador de URL

Web

Descompone una URL en esquema, host, puerto, ruta, parámetros y ancla, con cada parámetro en crudo y decodificado. Todo en tu navegador.

Analizador de UA

Web

Analiza un User-Agent: navegador, versión, sistema, tipo de dispositivo y motor, con las reglas que coinciden. Solo coincidencia de patrones.

Códigos de estado HTTP

Web

Consulta un código de estado HTTP: significado, clase 1xx–5xx, usos típicos y trampas habituales. También busca por palabra clave. Todo local.

← Volver a todas las herramientas