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.me | Design 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 切换
- 在 Design Extractor 首页粘贴网站网址,运行一次 Pro 提取。
- 把结果以 DESIGN.md 为名保存在仓库根目录,替换旧文件。你在 AGENTS.md 或 CLAUDE.md 中的指引依然有效。
- 如果想让你的智能体自己运行提取,请连接 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 提取这个网站,然后替换文件即可。