Cómo usar esta herramienta para desarrolladores
- Pega el CSS que quieras revisar.
- Pulsa «Comprobar CSS».
- Corrige errores de llaves o declaraciones antes que los avisos.
- Prueba después el CSS en los navegadores objetivo.
CSS Checker
Comprueba CSS localmente para detectar llaves y comentarios sin cerrar, declaraciones sin dos puntos, propiedades duplicadas dentro de un bloque, colores hexadecimales sospechosos y uso intensivo de !important. El informe separa errores y avisos para acelerar una primera revisión del código.
Datos de entrada
Texto o códigoEspacio publicitario
Qué hace esta herramienta para desarrolladores
Analiza la estructura básica de una hoja de estilos y señala patrones que suelen indicar errores de sintaxis o mantenimiento.
Primero se recorre el texto para controlar llaves, comentarios y cadenas; después se inspeccionan bloques y declaraciones con reglas adicionales.
No implementa toda la gramática CSS ni conoce el soporte de cada navegador. At-rules complejas y sintaxis moderna pueden requerir un parser especializado.
Ejemplo
/* Tarjeta de ejemplo */
.card {
display: grid;
gap: 1rem;
padding: 1.5rem;
color: #1f2937;
background: #ffffff;
border-radius: 12px;
}
.card a {
color: #2563eb;
text-decoration: none;
}Casos de uso
- Detectar errores rápidos en snippets.
- Revisar hojas de estilo antes de un commit.
- Encontrar propiedades duplicadas y abuso de !important.
Consejos para obtener resultados fiables
- No elimines una propiedad duplicada sin revisar el fallback previsto.
- Comprueba variables CSS y funciones modernas en navegadores objetivo.
- Usa herramientas de compatibilidad para propiedades experimentales.
- Mantén los selectores legibles para facilitar revisiones.
Detalles del procesamiento
El checker evita contar llaves dentro de comentarios y cadenas. La segunda fase inspecciona reglas simples y contabiliza declaraciones y patrones problemáticos.
No resuelve @supports, @layer, nesting complejo ni valida valores contra una base completa de propiedades CSS.
Preguntas frecuentes
¿Qué errores puede detectar un CSS Checker sin servidor?
Puede señalar llaves o comentarios sin cerrar, declaraciones mal formadas y varios patrones de mantenimiento mediante análisis local del texto.
¿Una propiedad CSS duplicada siempre es un error?
No. A veces se usa deliberadamente como fallback; por eso la herramienta la presenta como aviso y no como error automático.
¿Cómo se detecta un uso excesivo de !important?
La herramienta cuenta las declaraciones que contienen !important y muestra un aviso cuando aparecen repetidamente.
¿El checker confirma compatibilidad con todos los navegadores?
No. No incluye una base de datos de compatibilidad; debes comprobar propiedades y funciones según los navegadores que soporte tu proyecto.
¿El código CSS se envía a un servicio externo para analizarlo?
No. Las comprobaciones incluidas se ejecutan localmente mediante JavaScript en el navegador.
Herramientas relacionadas para desarrolladores
Módulos del análisis
| Módulo | Función |
|---|---|
| Balanceo | Controla llaves, comentarios y cadenas. |
| Declaraciones | Busca sintaxis incompleta y duplicados. |
| Mantenimiento | Cuenta !important y patrones sospechosos. |