designmd.me vs Design Extractor

designmd.me 和 Design Extractor 都能把网站网址转换成供你的 AI 编程智能体使用的 DESIGN.md。Design Extractor 的文件遵循 Google 的 DESIGN.md 规范,并把从页面中挑选的每个组件以 HTML 和 CSS 配方的形式交付,供你的智能体重建。每个配方都会与实时网站进行核对,或标注原因。它也支持只响应特定国家访问者的网站。

刚接触这个格式?请先阅读什么是 DESIGN.md。

核实于 ,依据designmd.me、其价格页面、其 CLI 参考文档、其 Figma 页面和其 Discover 栏目中的一个文件。服务内容和价格可能会变化,做决定前请查看对方网站。

为什么选择 Design Extractor

  • 遵循 Google 的 DESIGN.md 规范

    YAML front matter 只使用规范定义的属性,没有自定义的顶层键。标准章节按规范的顺序排列,从 Overview 到 Do's and Don'ts。front matter 中的组件条目只使用规范规定的八个属性,并使用字面值。任何文件都可以用免费的 DESIGN.md 校验器检查。

  • 为从页面中挑选的每个组件提供配方

    从页面中挑选的页头、页脚、按钮、输入框、卡片和其他组件,每个都以配方的形式交付:位于 DESIGN.md 的 Components 章节中、使用字面值的精炼 HTML 和 CSS。每个配方都列出了它的组成部分,以及在网站上观察到的悬停和聚焦状态,让你的编程智能体可以重建组件,而不必去猜。

  • 与实时网站核对

    每个配方都会被单独渲染,并与实时网站进行核对:将渲染出的各部分与页面上测得的数据做结构匹配,并与真实元素的最新截图做像素对比。未通过的配方会被重建并再次检查。仍未通过的配方会标注原因,绝不会作为已验证的配方交付。结果页会显示组件的匹配程度,以及覆盖了网站多少颜色和文字样式:请看示例库中的 Stripe。

  • 支持地区受限的网站

    有些网站只响应来自特定国家的访问者。当提取因此失败时,结果页会提供国家选择器,优先列出已发现可以加载该页面的国家,并通过你所选国家的浏览器运行同样的提取。从其他国家提取的费用为 Pro 价格加 6 积分附加费(共 16 积分)。如果提取失败,我们会退还你的积分。

并排对比

designmd.meDesign Extractor
规范符合度生成的 YAML front matter 包含规范的令牌,另外还有规范未定义的顶层键,例如 source、themes 和 breakpoints。章节是它自己定义的,从 Visual Theme & Atmosphere 到 Known Gaps 依次编号。遵循 Google 的 DESIGN.md 规范:front matter 只使用规范的属性,没有自定义的顶层键;标准章节按规范的顺序排列;组件条目仅限规范规定的八个属性,并使用字面值。
组件配方每个组件都是一组样式值,例如背景、字体、内边距、边框和圆角,不含 HTML。从页面中挑选的每个组件,比如页头、页脚、按钮、输入框和卡片,都以配方的形式交付:Components 章节中的精炼 HTML 和 CSS,供你的编程智能体重建。
与实时网站核对不提供是。每个配方都会被单独渲染并与实时网站核对:对其各部分做结构匹配,并做像素对比。未通过的组件会标注原因,绝不会作为已验证的组件交付。
地区受限的网站不提供是。当网站屏蔽某些国家的访问者时,失败的提取会提供国家选择器,优先列出可以加载该页面的国家,并通过那里的浏览器运行同样的提取。从其他国家提取的费用为 Pro 价格加 6 积分附加费(共 16 积分)。
是什么一个生成器:粘贴网址,获取 DESIGN.md。由 Crowdlinker 打造。一个生成器:粘贴公开网址,获取该网站的 DESIGN.md。
读取的页面单页(落地页)或多页(网站的关键页面),每次运行时自选。Pro 会抽样网站的关键页面。
每次提取的价格单页 4 积分,多页 8 积分,仅在成功时收费。一次 Pro 提取需要 10 积分。因我们这边的原因失败的提取会退还积分。
积分包US$5 购买 50,US$15 购买 175,US$30 购买 375,或自定义充值。积分永不过期。US$5 购买 50,US$10 购买 110,US$25 购买 300。积分永不过期。无需订阅。
免费起步首次访问赠送 4 积分,注册时再送 20 积分。开始使用无需绑卡。注册不赠送积分。示例库和免费工具不收取任何费用。
附加功能HTML 预览文件(另需 8 积分)、将 Variables、Styles 和一个画板导入 Figma(12 积分,每次生成收取一次),以及两个网站的并排对比。结果页上提供文件的“源码”和“预览”视图以及“视觉系统”面板,另有免费工具:DESIGN.md 校验器、字体查找器和配色提取器。
现成示例一个展示已生成网站的 Discover 板块,带分类和排行榜。一个预提取品牌的示例库,可免费阅读和复制。
智能体访问一个 CLI(@crowdlinker/designmdme),以及适用于 Claude Code、Cursor 和其他支持技能的智能体的智能体技能。没有 MCP 服务器。适用于 Claude Code、claude.ai、ChatGPT、Codex、Cursor 和其他客户端的远程 MCP 服务器,以及适用于 Claude Code 和 Codex 的插件。
浏览器扩展程序不提供一款可以提取当前标签页的 Chrome 扩展程序。

designmd.me 提供什么

  • 首次访问和注册时赠送免费积分,开始使用无需绑卡。
  • 单页提取 4 积分,多页提取 8 积分,仅在成功时收费。
  • HTML 样张页面,以及将 Variables 和 Styles 导入 Figma,各需额外积分。
  • 两个网站设计系统的并排对比。
  • 一个 CLI,以及适用于 Claude Code、Cursor 和其他支持技能的智能体的智能体技能。

两者的区别

两款工具都能从网址返回 DESIGN.md。Design Extractor 把从页面中挑选的每个组件作为配方交付,并与实时网站核对,这样你的智能体就知道哪些组件可以照原样重建,哪些被标注了,以及原因。请看示例库中的 Stripe。

Design Extractor 也能融入你的工作环境。你的智能体可以通过 MCP 服务器发起提取并读取结果,Chrome 扩展程序则可以提取你当前的标签页。在示例库中查看更多完成的文件。

如何从 designmd.me 切换

  1. 在 Design Extractor 首页粘贴网站网址,运行一次 Pro 提取。
  2. 把结果以 DESIGN.md 为名保存在仓库根目录,替换旧文件。你在 AGENTS.md 或 CLAUDE.md 中的指引依然有效。
  3. 如果想让你的智能体自己运行提取,请连接 MCP 服务器,代替 designmd.me 的 CLI。

结论

如果你需要一份遵循 Google 规范的 DESIGN.md,为从页面中挑选的每个组件提供配方,并且每个配方都与实时网站核对或标注原因,请选择 Design Extractor。它可以访问地区受限的网站。你的智能体可以通过 MCP 运行它。如表格所示,designmd.me 每次提取消耗的积分更少。

其他对比

  • getdesign.md vs Design Extractor

    一个精选的现成 DESIGN.md 文件合集,对比可从任意网址生成、符合规范且组件配方经实时网站核对的 DESIGN.md。

  • Refero Styles vs Design Extractor

    一个大型免费网站风格库,对比可从任意网址生成、符合规范且组件配方经实时网站核对的 DESIGN.md。

  • TypeUI vs Design Extractor

    TypeUI 的免费 Chrome 扩展程序会根据标签页中的样式填充它自己的模板,对比符合规范、组件配方经实时网站核对的 DESIGN.md。

查看全部对比

常见问题

designmd.me vs Design Extractor:常见问题

关于 designmd.me 和 Design Extractor 的简短解答,核实于 2026-10-20。

可以免费起步:在 2026-10-20,新访问者可获得 4 免费积分,注册时再获得 20 积分,无需绑卡。之后,积分包最低 US$5 购买 50 积分。单页提取需要 4 积分,多页提取需要 8 积分。

designmd.me 更便宜。它的积分包最低 US$5 购买 50 积分,我们的最低 US$5 购买 50 积分。designmd.me 多页提取需要 8 积分,单页提取需要 4 积分;Design Extractor 的 Pro 提取需要 10 积分。它的 HTML 预览和 Figma 导入需要额外积分。

一份遵循 Google 规范的 DESIGN.md,令牌位于 front matter 中,从页面中挑选的每个组件(比如页头、页脚、按钮、输入框和卡片)都以精炼 HTML 和 CSS 配方的形式提供。每个配方都会通过结构匹配和像素对比与实时网站进行核对,未通过的配方会标注原因。

没有。designmd.me 提供一个 CLI 和一个智能体技能,但没有 MCP 服务器。Design Extractor 是一个远程 MCP 服务器:claude.ai、Claude Desktop、ChatGPT 和 Claude Code 通过登录连接,Codex、Cursor 和脚本使用 API 密钥。

Design Extractor 可以从其他国家运行提取。当提取因此失败后,结果页会提供国家选择器,优先列出可以加载该页面的国家,并通过那里的浏览器运行同样的提取。从其他国家提取的费用为 Pro 价格加 6 积分附加费(共 16 积分)。如果提取失败,我们会退还你的积分。

可以。两者生成的 DESIGN.md 都放在你的仓库中,所以你的智能体设置保持不变。用 Design Extractor 提取这个网站,然后替换文件即可。

为你需要的网站获取 DESIGN.md

粘贴任意公开网址。Pro 会抽样网站的关键页面,返回一份符合规范的 DESIGN.md,其中的组件配方都经过与实时网站的核对。