Extractor de propiedades personalizadas CSS procesa el contenido directamente en tu navegador para extraer declaraciones de propiedades personalizadas CSS con su nombre y valor. Está pensado para trabajo técnico cotidiano: admite ejemplos reales, muestra un resultado reutilizable y resume los datos relevantes sin enviar el texto a servicios externos. Revisa las opciones antes de ejecutar la herramienta cuando necesites adaptar el formato de salida.
Extraer declaraciones de propiedades personalizadas css con su nombre y valor.
El resultado se genera localmente en el navegador. Compruébalo antes de incorporarlo a código de producción.
Entrada:
:root { --brand: #f59e0b; --space-md: 16px; }Resultado esperado:
--brand: #f59e0b --space-md: 16px
Se aplica un patrón a comentarios eliminados de forma segura para localizar nombres que empiezan por -- y capturar su valor hasta el punto y coma.
La herramienta cubre patrones habituales y no sustituye un compilador, un analizador de esquema completo ni las bibliotecas oficiales del lenguaje.
Sí. Busca declaraciones --nombre: valor; en todo el CSS, sin limitarse a :root.
Se muestran todas las declaraciones encontradas para que puedas detectar redefiniciones por selector o contexto.
Sí. El valor se conserva como texto hasta el punto y coma de la declaración, incluidos paréntesis y referencias var().
Esta herramienta se centra en declaraciones. Para auditar referencias habría que analizar por separado los usos de var().
Sí. Puedes extraer nombres y valores y después revisar duplicados, convenciones de nombres y valores reutilizados.
| Módulo | Función |
|---|---|
| Limpieza | Ignora comentarios CSS antes de analizar. |
| Extractor | Localiza declaraciones --propiedad. |
| Informe | Lista nombres, valores y duplicados. |