- 形态
- MCP
- 传输协议
- stdio
- 是否开源
- 是
- GitHub Stars
- ★ 3.3k
- 收录来源
- mcp-github
能力说明
design-extract 是一个 MCP 服务器，通过一条命令即可从任何网站提取完整的 UI 设计系统。它能够生成 DTCG 令牌、语义+基本+复合组件，并支持多平台输出（如 iOS SwiftUI、Android Compose、Flutter 和 WordPress）。此外，它还提供 Tailwind v4 配置、Figma 变量、shadcn/ui、CSS 健康审计、WCAG 修复等功能。该工具适用于需要快速获取网站设计系统的开发者和设计师。
能力点
- ▪提取网站的完整设计系统
- ▪生成 DTCG 令牌
- ▪支持多平台输出
- ▪提供 Tailwind v4 配置
- ▪生成 Figma 变量
- ▪进行 CSS 健康审计
适用场景
快速提取网站的设计系统生成多平台的设计代码进行 CSS 健康检查生成 Figma 设计变量
接入方式
依赖：Node 20+
npx designlang <URL>
以上信息由 AI 基于公开资料整理，可能存在偏差，以来源为准。
常见问题
如何安装和使用 design-extract？
使用 npx designlang <URL> 命令即可安装并运行。
design-extract 支持哪些平台？
支持 iOS SwiftUI、Android Compose、Flutter 和 WordPress 等。
相关 Skill
MeiGen-AI-Design-MCP
支持多种AI图像和视频生成模型的MCP服务器，内置1400+提示库。
MCP
davinci-resolve-mcp
通过MCP协议让AI助手控制DaVinci Resolve Studio。
MCP
short-video-maker
基于文本生成适用于TikTok、Instagram Reels和YouTube Shorts的短视频。
MCP
hyperframes
通过 HTML 和 CSS 创建视频，专为 AI 代理设计。
MCP
palmier-pro
为AI构建的macOS视频编辑器，支持生成和编辑视频。
MCP
Generative-Media-Skills
多模态生成媒体技能，支持高质量图像、视频和音频生成。
MCP多模态生成媒体