Formateador CSS Online

Un formateador de CSS vuelve a aplicar sangría a las reglas de la hoja de estilos con espaciado consistente: una declaración por línea y una línea en blanco entre bloques de reglas. Hace que el CSS minificado o escrito a mano sea más fácil de leer, revisar y mantener.

Esta herramienta formatea CSS estándar. SCSS y Less usan sintaxis compatible con CSS con extensiones (variables, anidamiento, mixins). Los archivos SCSS/Less simples sin características avanzadas se formatearán correctamente. Para archivos con anidamiento o reglas at específicas de SCSS/Less, usa una extensión de editor como Prettier con el plugin de SCSS para un formateo preciso.

El formateo corrige los espacios en blanco y la sangría para que coincidan con un estilo consistente. El linting comprueba errores y calidad del código: propiedades duplicadas, valores inválidos, selectores no utilizados y conflictos de especificidad. Esta herramienta solo formatea. Para el linting, usa Stylelint, un linter de CSS ampliamente adoptado que se integra con VS Code, GitHub Actions y la mayoría de las herramientas de compilación.

No de forma predeterminada: las propiedades se conservan en el orden en que aparecen. El orden alfabético es una elección de estilo (preferida por algunos equipos por su predictibilidad) pero no es estándar. Si quieres propiedades ordenadas, usa Stylelint con el plugin stylelint-order, o configura Prettier con la extensión prettier-plugin-css-order.

Sí. El formateo hace que las reglas con prefijos de proveedor (-webkit-, -moz-, -ms-) sean visualmente obvias al alinearse con sus equivalentes estándar. Tras el formateo, revisa qué prefijos siguen siendo necesarios: la mayoría de los navegadores modernos ya no los requieren para flexbox, grid, transiciones o transformaciones. Usa Autoprefixer para gestionar los prefijos automáticamente.