lobsite! Iniciar sesión Registrarse

Herramientas gratuitas /

Formateador CSS

Pega CSS minificado o desordenado y obtén una regla por bloque, una propiedad por línea, con la indentación que prefieras. Gratis, en tu navegador.

Minificador de CSS →
Formateado

Cómo usarlo

  1. Pega tu CSS, abre un archivo .css o empieza con el ejemplo: una hoja de estilos minificada.
  2. Elige 2 espacios, 4 espacios o tabulaciones. El CSS formateado aparece mientras escribes.
  3. Cópialo o descárgalo como styles.css.

Qué hace

Cada regla tiene su propio bloque, cada declaración su propia línea, y las reglas dentro de @media y otras reglas @ se sangran un nivel más. Selectores, valores y comentarios se quedan tal cual, así que la hoja de estilos significa exactamente lo mismo.

Cuándo ayuda

  • Para leer una hoja de estilos minificada de un tema, un framework o un sitio que estás inspeccionando.
  • Para ordenar CSS antes de editarlo, de modo que un cambio toque una línea y no una sola muy larga.
  • Para comparar dos hojas de estilos: formatea ambas y compáralas con un diff.

Preguntas frecuentes

¿Corrige CSS no válido?

No. Sangra lo que hay; una llave que falta sigue faltando. Los navegadores ignoran las declaraciones que no pueden leer, así que un carácter suelto suele romper una regla, no la hoja de estilos entera.

¿Ordena las propiedades?

No. En CSS el orden puede importar (gana la declaración posterior), así que se mantiene como está escrito.

¿Puedo volver a minificarlo después?

Sí: el Minificador CSS lo vuelve a dejar en una sola línea compacta.

¿Se sube mi CSS?

No. El formateo se hace en tu navegador.