designmd.me vs Design Extractor
designmd.me y Design Extractor convierten la URL de un sitio web en un DESIGN.md para tu agente de programación con IA. El archivo de Design Extractor sigue la especificación DESIGN.md de Google e incluye cada componente que toma de la página como una receta de HTML y CSS que tu agente puede reconstruir. Cada receta se comprueba con el sitio en vivo o se marca con el motivo. También funciona en sitios que solo responden a visitantes de ciertos países.
¿Es tu primera vez con el formato? Lee primero qué es un DESIGN.md.
Comprobado el consultando designmd.me, su página de precios, su referencia de la CLI, su página de Figma y un archivo de su sección Discover. Las ofertas y los precios cambian, así que revisa su sitio antes de decidir.
Por qué Design Extractor
Sigue la especificación DESIGN.md de Google
El front matter en YAML usa solo las propiedades que define la especificación, sin claves de primer nivel personalizadas. Las secciones canónicas van en el orden de la especificación, de Overview a Do's and Don'ts. Las entradas de componentes del front matter usan solo las ocho propiedades de la especificación, con valores literales. Comprueba cualquier archivo con el validador de DESIGN.md gratuito.
Una receta para cada componente que toma de la página
La cabecera, el pie de página, los botones, los campos, las tarjetas y otros componentes tomados de la página se entregan cada uno como una receta: HTML y CSS depurados con valores literales, dentro de la sección Components del DESIGN.md. Cada receta indica sus partes y los estados hover y focus vistos en el sitio, para que tu agente de programación pueda reconstruir el componente en lugar de adivinarlo.
Verificado con el sitio en vivo
Cada receta se renderiza por separado y se comprueba con el sitio en vivo: una coincidencia estructural de las partes renderizadas con lo que se midió en la página y una comparación de píxeles con una captura nueva del elemento real. Una receta que falla se reconstruye y se vuelve a comprobar. La que sigue sin pasar se marca con el motivo y nunca se entrega como verificada. La página de resultado muestra cuánto se parecen los componentes y qué parte de los colores y estilos de texto del sitio está cubierta: mira Stripe en la galería.
Funciona en sitios con restricción regional
Algunos sitios solo responden a visitantes de ciertos países. Cuando una extracción falla por eso, la página de resultado ofrece un selector de país, con los países desde los que se comprobó que carga la página en primer lugar, y hace la misma extracción a través de un navegador en el país que elijas. Una extracción desde otro país cuesta el precio Pro más un recargo de 6 en créditos (16 créditos en total). Si la extracción falla, te devolvemos los créditos.
Cara a cara
| designmd.me | Design Extractor | |
|---|---|---|
| Conformidad con la especificación | Escribe un front matter en YAML con los tokens de la especificación, más claves de primer nivel que la especificación no define, como source, themes y breakpoints. Las secciones son propias, numeradas de Visual Theme & Atmosphere a Known Gaps. | Sigue la especificación DESIGN.md de Google: front matter solo con las propiedades de la especificación y sin claves de primer nivel personalizadas, las secciones canónicas en el orden de la especificación y entradas de componentes limitadas a las ocho propiedades de la especificación con valores literales. |
| Recetas de componentes | Cada componente es una lista de valores de estilo, como el fondo, la fuente, el padding, el borde y el radio, sin HTML. | Cada componente que toma de la página, como la cabecera, el pie de página, los botones, los campos y las tarjetas, se entrega como una receta: HTML y CSS depurados en la sección Components, para que tu agente de programación pueda reconstruirlo. |
| Verificado con el sitio en vivo | No se ofrece | Sí. Cada receta se renderiza por separado y se comprueba con el sitio en vivo: una coincidencia estructural de sus partes y una comparación de píxeles. Un componente que no pasa se marca con el motivo y nunca se entrega como verificado. |
| Sitios con restricción regional | No se ofrece | Sí. Cuando un sitio bloquea a visitantes de algunos países, la extracción fallida ofrece un selector de país, con los países desde los que carga la página en primer lugar, y hace la misma extracción a través de un navegador allí. Una extracción desde otro país cuesta el precio Pro más un recargo de 6 en créditos (16 créditos en total). |
| Qué es | Un generador: pegas una URL y obtienes un DESIGN.md. Creado por Crowdlinker. | Un generador: pegas una URL pública y obtienes el DESIGN.md de ese sitio. |
| Páginas que lee | Una sola página (la página de inicio) o varias páginas (las páginas clave del sitio), a elegir en cada extracción. | Pro recorre las páginas clave del sitio. |
| Precio por extracción | 4 créditos por una página, 8 créditos por varias páginas, cobrados solo si sale bien. | 10 créditos por una extracción Pro. Las extracciones que fallan por un problema de nuestra parte se reembolsan. |
| Paquetes de créditos | 5 US$ por 50, 15 US$ por 175, 30 US$ por 375, o una recarga personalizada. Los créditos no caducan. | 5 US$ por 50, 10 US$ por 110, 25 US$ por 300. Los créditos no caducan. Sin suscripción. |
| Inicio gratuito | 4 créditos gratis en tu primera visita y 20 más al registrarte. Sin tarjeta para empezar. | Sin créditos gratis al registrarte. La galería y las herramientas gratuitas no cuestan nada. |
| Extras | Un archivo HTML de vista previa (8 créditos más), una importación a Figma de variables, estilos y un tablero (12 créditos, una vez por generación) y comparaciones lado a lado de dos sitios. | Una vista Código fuente y Vista previa del archivo y un panel Sistema visual en la página de resultado, más herramientas gratuitas: un validador de DESIGN.md, un buscador de fuentes y un extractor de paletas de colores. |
| Ejemplos ya hechos | Una sección Discover de sitios generados, con categorías y una clasificación. | Una galería de marcas ya extraídas, que se puede leer y copiar gratis. |
| Acceso para agentes | Una CLI (@crowdlinker/designmdme) y un skill de agente para Claude Code, Cursor y otros agentes compatibles con skills. Sin servidor MCP. | Un servidor MCP remoto para Claude Code, claude.ai, ChatGPT, Codex, Cursor y otros clientes, y un plugin para Claude Code y Codex. |
| Extensión del navegador | No se ofrece | Una extensión de Chrome que extrae la pestaña en la que estás. |
Qué ofrece designmd.me
- Créditos gratis en la primera visita y al registrarte, sin tarjeta para empezar.
- Extracciones de una página a 4 créditos y de varias páginas a 8, cobradas solo si salen bien.
- Una página HTML de muestra y una importación a Figma de variables y estilos, cada una por créditos adicionales.
- Comparaciones lado a lado de los sistemas de diseño de dos sitios.
- Una CLI y un skill de agente para Claude Code, Cursor y otros agentes compatibles con skills.
En qué se diferencian
Las dos herramientas devuelven un DESIGN.md a partir de una URL. Design Extractor entrega cada componente que toma de la página como una receta y la comprueba con el sitio en vivo, para que tu agente sepa qué componentes puede reconstruir tal cual y cuáles se marcaron, con el motivo. Míralo en Stripe en la galería.
Design Extractor también está donde trabajas. Tu agente puede iniciar una extracción y leer el resultado a través del servidor MCP, y la extensión de Chrome extrae la pestaña en la que estás. Mira más archivos terminados en la galería.
Cómo cambiarte desde designmd.me
- Pega la URL del sitio en la página de inicio de Design Extractor y haz una extracción Pro.
- Guarda el resultado como DESIGN.md en la raíz de tu repositorio, en lugar del archivo anterior. Tu referencia en AGENTS.md o CLAUDE.md sigue funcionando.
- Para que tu agente haga extracciones por su cuenta, conecta el servidor MCP en lugar de la CLI de designmd.me.
Veredicto
Elige Design Extractor si necesitas un DESIGN.md que siga la especificación de Google, con una receta para cada componente que toma de la página, cada una comprobada con el sitio en vivo o marcada con el motivo. Llega a sitios con restricción regional. Tu agente puede usarlo por MCP. designmd.me cuesta menos créditos por extracción, como muestra la tabla.
Otras comparativas
getdesign.md vs Design Extractor
Una colección curada de archivos DESIGN.md ya hechos frente a un DESIGN.md conforme a la especificación, con recetas de componentes comprobadas con el sitio en vivo, a partir de cualquier URL.
Refero Styles vs Design Extractor
Una gran biblioteca gratuita de estilos de sitios web frente a un DESIGN.md conforme a la especificación, con recetas de componentes comprobadas con el sitio en vivo, a partir de cualquier URL.
TypeUI vs Design Extractor
La extensión de Chrome gratuita de TypeUI, que rellena su propia plantilla con los estilos de tu pestaña, frente a un DESIGN.md conforme a la especificación con recetas de componentes comprobadas con el sitio en vivo.
Preguntas frecuentes
designmd.me vs Design Extractor: preguntas
Respuestas breves sobre designmd.me y Design Extractor, comprobadas el 2026-10-20.
Empieza gratis: el 2026-10-20, los visitantes nuevos recibían 4 créditos gratis y 20 más al registrarse, sin tarjeta. Después, los paquetes de créditos empiezan en 5 US$ por 50 créditos. Una extracción de una página cuesta 4 créditos y una de varias páginas, 8.
designmd.me. Sus paquetes empiezan en 5 US$ por 50 créditos y los nuestros en 5 US$ por 50 créditos. Una extracción de varias páginas en designmd.me cuesta 8 créditos y una de una página, 4; una extracción Pro de Design Extractor cuesta 10. Su vista previa HTML y su importación a Figma cuestan créditos adicionales.
Un DESIGN.md que sigue la especificación de Google, con los tokens en el front matter y cada componente que toma de la página, como la cabecera, el pie de página, los botones, los campos y las tarjetas, como una receta de HTML y CSS depurados. Cada receta se comprueba con el sitio en vivo mediante una coincidencia estructural y una comparación de píxeles, y la que no pasa se marca con el motivo.
No. designmd.me ofrece una CLI y un skill de agente, pero ningún servidor MCP. Design Extractor es un servidor MCP remoto: claude.ai, Claude Desktop, ChatGPT y Claude Code se conectan iniciando sesión, y Codex, Cursor y los scripts usan una clave de API.
Design Extractor puede hacer la extracción desde otro país. Cuando una extracción falla por eso, la página de resultado ofrece un selector de país, con los países desde los que carga la página en primer lugar, y hace la misma extracción a través de un navegador allí. Una extracción desde otro país cuesta el precio Pro más un recargo de 6 en créditos (16 créditos en total). Si la extracción falla, te devolvemos los créditos.
Sí. Los dos generan un DESIGN.md que va en tu repositorio, así que la configuración de tu agente no cambia. Pasa el sitio por Design Extractor y sustituye el archivo.
Obtén un DESIGN.md del sitio que necesitas
Pega cualquier URL pública. Pro recorre las páginas clave del sitio y devuelve un DESIGN.md conforme a la especificación, con recetas de componentes comprobadas con el sitio en vivo.