design-extract
★ 4.3k
vs
nvim-mcp
★ 66
design-extract vs nvim-mcp
design-extract:designlang 是一款独特的工具,它通过无头浏览器抓取任何网站,从实时 DOM 中提取全面的计算样式、布局模式、动效语言、组件结构和品牌声音。它能生成超过 17 种不同的输出文件,包括 AI 优化的 Markdown、Tailwind 配置、React 主题和 Figma 变量,从而实现对网站视觉 DNA 的精确捕获和转换。用户可以利用它进行设计系统评分、将代码库与实时网站进行漂移检查,以及对多个 URL 或品牌进行视觉比较。;nvim-mcp:nvim-mcp 提供了一个 MCP 服务器,通过 Neovim 的原生 msgpack-RPC 套接字连接到正在运行的 Neovim 会话,让 AI 代理能够查看编辑器状态、在内存中编辑缓冲区、运行 Vim 命令、发送按键、查询 LSP 诊断等。它兼容 Cursor、Claude Code、Codex 等 MCP 客户端,并设计为安全、非破坏性操作,支持完全撤销。
01
简评
design-extractDev Tooling · ★ 4.3k
通过从实时网站提取完整设计资产,自动化设计系统的创建和维护。
nvim-mcpDev Tooling · ★ 66
无需离开 Neovim 即可进行 AI 辅助代码编辑
02
并排对比
03
功能特性
01全面样式提取,包括布局模式、动效语言、组件结构和品牌声音。
02生成超过 17 种多样化的输出文件(例如,AI 优化 Markdown、Tailwind 配置、Figma 变量、W3C 设计令牌)。
03高级设计分析,包括响应式行为捕获、交互状态记录和 WCAG 可访问性评分。
04赋能 AI 的语义提取,用于页面意图、区域角色、视觉 DNA 和组件库检测。
05设计系统操作,如代码库与实时网站的漂移检查、两URL视觉差异对比、多品牌比较和实时站点令牌同步。
01查看编辑器状态(模式、目录、缓冲区、光标等)
02在内存中编辑缓冲区并支持撤销
03运行任意 Vim 命令
04发送按键
05查询 LSP 诊断
04
使用场景
↳通过从实时网站提取完整设计资产,自动化设计系统的创建和维护。
↳通过漂移检查、视觉差异对比和多品牌比较,监控并确保项目或品牌之间的设计一致性。
↳通过向大型语言模型(LLMs)提供结构化的设计数据和提示包,加速 AI 驱动的前端开发以实现逼真的网站重建。
↳无需离开 Neovim 即可进行 AI 辅助代码编辑
↳自动重构和诊断修复
↳在单个 Neovim 会话中实现多客户端协作
FAQ
常见问题
design-extract 和 nvim-mcp 有什么区别?
design-extract 和 nvim-mcp 都属于 Dev Tooling 类别。design-extract 有 4.3k Stars,nvim-mcp 有 66 Stars。
design-extract 和 nvim-mcp 哪个更好?
最佳选择取决于你的具体需求。通过从实时网站提取完整设计资产,自动化设计系统的创建和维护。 时选 design-extract,无需离开 Neovim 即可进行 AI 辅助代码编辑 时选 nvim-mcp。
design-extract 是免费的吗?
是的,design-extract 在 GitHub 开源(MIT)。
nvim-mcp 是免费的吗?
是的,nvim-mcp 在 GitHub 开源(MIT)。
推荐云部署
Ad在 DigitalOcean 上一键部署
为你的 MCP 服务、Docker 容器与智能体提供即开即用云服务器,新用户立享 $200 免费额度(60天有效)。
→