Design MD Generator
Extrae tokens de diseño reales de una URL pública y genera DESIGN.md para agentes de programación con IA
Acerca de Design MD Generator
Design MD Generator acepta una URL pública, extrae del CSS real los colores, fuentes, proporciones de tamaños, espaciado, radios, sombras y estados de componentes, y genera un DESIGN.md de nueve secciones sobre temas, roles de paleta, tipografía, diseño, componentes, jerarquía, radios, movimiento y normas de diseño. El archivo puede guardarse en un repositorio de código y referenciarse desde CLAUDE.md o .cursor/rules para que las interfaces generadas coincidan con el sistema de diseño del sitio de origen; MCP también permite buscar en la biblioteca, leer archivos o ejecutar el generador desde un editor.
Ideal para
Mejores casos de uso
Generar un archivo de sistema de diseño para un sitio existente
Hacer que un agente de programación con IA reutilice el diseño del sitio de origen
Ejecutar el generador mediante MCP desde un editor
Explorar sistemas de diseño DESIGN.md ya preparados
Funciones
Extracción de CSS real
Analiza colores, pilas de fuentes, proporciones de tamaños, espaciado, radios, sombras y propiedades personalizadas de CSS en estilos reales.
Análisis basado en evidencia
Cada color hexadecimal, nombre de fuente y radio procede del CSS real del sitio; el extractor no inventa tokens.
DESIGN.md de nueve secciones
Un analista de diseño con IA genera temas, roles de paleta, tipografía, diseño, componentes, jerarquía, radios, movimiento y normas.
Conexión MCP con el editor
Busca en la biblioteca, lee DESIGN.md o ejecuta el generador en un editor mediante MCP.
Ventajas
- Los tokens proceden del CSS real y evitan suposiciones
- La salida puede guardarse en un repositorio de código y ser consultada por agentes
- Generación gratuita dentro del límite diario
- Compatible con MCP para usarlo cómodamente desde el editor
Limitaciones
- Límite diario de generación por visitante
Planes de precios
Gratis
- Generar DESIGN.md
- Límite diario por visitante
- No se necesita tarjeta de crédito
* La información de precios es solo orientativa. Consulta el anuncio más reciente en el sitio web oficial de Design MD Generator.