Corrector CSS
Repara y corrige automáticamente la sintaxis CSS rota
¿Qué es el Corrector CSS?
El CSS falla en silencio. Te comes un punto y coma después de color: #222, escribes txt-align en lugar de text-align, dejas una { de más antes de #cart-summary, u olvidas cerrar la cadena en content: "Total — el navegador no lanza error, simplemente ignora la regla. El corrector caza esas roturas y te devuelve CSS que sí parsea. Funciona con selectores reales como .order-row o #cart-summary, no con ejemplos de juguete.
La especificación CSS la mantiene el W3C CSS Working Group, con borradores activos en drafts.csswg.org; MDN CSS es la referencia del día a día sobre lo que hace cada propiedad. Tras corregir, pasa el resultado por un validador CSS para confirmar y consulta caniuse.com para ver el soporte por navegador.
El procesamiento ocurre en el servidor y no persistimos el input. Arregla las reglas, pégalas de vuelta en tu hoja de estilos, sigue.
Cómo Usar el Corrector CSS
Tres pasos. Cada uno usa los botones reales de esta página.
Pega CSS Roto o Carga Ejemplo
Pega tu CSS roto en el editor izquierdo. Pulsa CSS de Ejemplo para cargar una regla rota a propósito con los errores más comunes. Ejemplo de lo que el corrector repara:
.order-row {
color: #222
padding 12px;
}Repara punto y coma faltantes, {} desequilibradas, dos puntos faltantes entre propiedad y valor, cadenas sin cerrar y typos obvios en nombres de propiedades como txt-align.
Haz Clic en ¡Reparar CSS!!
Pulsa el botón verde ¡Reparar CSS!!. El corrector analiza tu input, identifica los problemas de sintaxis y escribe la versión reparada en el panel derecho. Aparece un indicador de carga durante el proceso.
Revisa la Salida Reparada
El panel derecho muestra el CSS reparado. Los valores de propiedades no se tocan — solo se corrige la sintaxis alrededor. Copia la salida de vuelta a tu hoja de estilos.
Cuándo Realmente Usarías Esto
Limpiar Hojas de Estilos Heredadas
Las hojas viejas acumulan pequeñas roturas de sintaxis — el tipo que tu editor nunca te avisó porque la regla de arriba y de abajo seguían parseando. Pasa el archivo por el corrector para encontrar lo que tu linter se saltó.
CSS de CMS o Editores WYSIWYG
Los editores de tema de los CMS y las exportaciones WYSIWYG adoran emitir una llave de cierre de más. El corrector normaliza eso sin que tengas que cazar la <code>}</code> sobrante.
Validación Pre-Build
Pasa el CSS roto por el corrector antes de que llegue a PostCSS, Sass o tu bundler — los errores del transpilador se vuelven mucho menos crípticos cuando la entrada era CSS válido para empezar.
Reparar Snippets Generados por IA
El CSS generado por LLM a menudo se salta uno o dos punto y coma. Pasa la salida del modelo por el corrector y obtienes CSS que de verdad se aplica en el navegador en lugar de fallar en silencio.
Preguntas Frecuentes
¿Se almacenan mis datos CSS?
No. La reparación corre en el servidor pero no persistimos el input. Una vez que la respuesta vuelve a tu navegador, desaparece de nuestro lado.
¿Qué tipos de errores repara?
Punto y coma faltantes, llaves desequilibradas, dos puntos faltantes entre propiedad y valor, cadenas sin cerrar y typos obvios en nombres de propiedades — los problemas del día a día. No reescribe tu diseño, solo arregla la sintaxis.
¿Cambia los valores de mis propiedades?
Solo cuando es necesario por sintaxis (por ejemplo, corregir txt-align a text-align). Los valores numéricos, colores y cadenas se mantienen como los escribiste.
¿Maneja <code>@media</code> y <code>@keyframes</code>?
Sí — el corrector trata los bloques dentro de at-rules (@media, @keyframes, @supports) igual que los bloques de regla de nivel superior. Las llaves o punto y coma faltantes ahí dentro también se reparan.
¿Cómo confirmo que el CSS reparado es válido?
Pasa la salida por un validador CSS tras la reparación. También puedes combinar el corrector con nuestro Validador CSS para un segundo pase rápido.
¿Funciona con SCSS o LESS?
El corrector apunta a CSS plano. Para sintaxis de preprocesador (variables, anidamiento, mixins) compila primero a CSS con SCSS a CSS o LESS a CSS, y luego pasa el corrector si hace falta.
Otras Herramientas CSS
Reparar es solo un paso. Aquí están las demás herramientas CSS que combinan bien: