lanhu-mcp

设计稿一键变代码，AI 编程效率翻倍

lanhu-mcp 是一个专为 AI 编程时代设计的团队协作 MCP 服务器，旨在将设计稿直接转化为可运行的代码。它解决的核心问题是设计与开发之间的鸿沟，让 AI 能够理解设计意图并自动生成前后端代码。项目通过连接设计工具（如蓝湖）与 AI 编程助手，实现需求分析、代码生成和切图下载的一体化流程。其核心能力包括：自动解析设计稿中的组件、样式和布局，生成结构清晰的前端代码；结合后端逻辑生成接口代码；并提供切图资源管理。它支持主流 MCP 协议，可无缝集成到 Cursor、Claude 等 AI 编程环境中，显著提升开发效率。

开源 unknown 智能体

访问官网 ↗ GitHub ↗ 文档 ↗

GitHub 星标 ★ 2421

维护状态活跃

是否开源是

定价模式 unknown

项目数据

分类智能体

开发团队dsphper

所属国家

官网地址

GitHubhttps://github.com/dsphper/lanhu-mcp

定价模式unknown

价格说明定价信息待确认

访问状态

是否开源是

开源协议MIT

主要语言Python

技术栈/模型ai,ai-agents,ai-coding,ai-tools,mcp,mcp-service,mcp-tools

GitHub 星标★ 2421

30天Star增速

HF 下载量

上线时间2025-12-17 00:00:00

最近更新2026-09-23 00:00:00

维护状态活跃

中文支持

访问方式

移动端支持

综合评分

收录时间2026-08-09

浏览次数3

使用教程

难度：入门约 10 分钟部署方式：Docker 8 步

环境要求

Python 3.10+（源码运行时需要）
Docker 与 Docker Compose（Docker 部署时使用）
支持视觉功能的 AI 模型，如 Claude、GPT、Gemini、Kimi、Qwen、DeepSeek
蓝湖账号及其 Cookie

安装与启动步骤

1选择视觉模型

必须使用具备图像识别能力的模型，纯文本模型如 GPT-3.5、Claude Instant 不可用。
2获取蓝湖 Cookie

登录蓝湖网页版，打开浏览器开发者工具，从请求头中复制 Cookie 备用。
3配置环境变量

在项目目录运行脚本，交互式获取并配置蓝湖 Cookie，自动生成 .env 文件。
```
bash setup-env.sh
```
4启动 Docker 服务

使用 Docker Compose 启动服务，服务器默认监听 8000 端口。
```
docker-compose up -d
```
5查看运行日志

跟踪容器日志，确认服务无报错并正常启动。
```
docker-compose logs -f
```
6源码安装依赖

源码运行替代方案：安装 Python 依赖并下载 Playwright 的 Chromium 浏览器。
```
pip install -r requirements.txt
playwright install chromium
```
7源码启动服务

设置 LANHU_COOKIE 等环境变量后，运行脚本启动 HTTP 版 MCP 服务。
```
python lanhu_mcp_server.py
```
8stdio 按需启动

适合 Cursor、Claude Code 等本地 MCP 客户端按需拉起服务，无需常驻 HTTP。
```
./run-stdio.sh
```

关键配置

配置项	必填	说明	示例
`LANHU_COOKIE`	是	蓝湖网页版请求头中的 Cookie，用于访问设计稿与需求文档	`your_lanhu_cookie_here`
`FEISHU_WEBHOOK_URL`	否	飞书机器人 Webhook 地址，用于团队留言板通知	`https://open.feishu.cn/open-apis/bot/v2/hook/your-webhook-ur`
`SERVER_HOST`	否	服务器监听地址	`0.0.0.0`
`SERVER_PORT`	否	服务器监听端口	`8000`
`FEISHU_USER_ID_MAP`	否	飞书用户 ID 映射字典，用于支持 @提醒功能

如何确认成功

执行 docker-compose logs -f 无报错，且 http://localhost:8000/mcp 可访问即启动成功。

常见问题

Q：必须使用什么 AI 模型？

A：必须支持视觉图像识别，推荐 Claude、GPT、Gemini、Kimi、Qwen、DeepSeek，不支持纯文本模型。

Q：如何获取蓝湖 Cookie？

A：登录蓝湖网页版，打开浏览器开发者工具，在请求头中复制 Cookie，然后配置到 .env 或环境变量中。

Q：Docker 和源码运行怎么选？

A：Docker 环境隔离、一键部署，推荐优先使用；源码运行需 Python 3.10+ 并安装 Playwright Chromium。

Q：stdio 和 HTTP 方式有何区别？

A：stdio 适合 Cursor、Claude Code 等本地 MCP 客户端按需拉起；HTTP 常驻服务监听 8000 端口。

注意事项

必须使用支持视觉功能的 AI 模型，纯文本模型无法使用本项目。
setup-env.sh 会交互式引导获取并配置蓝湖 Cookie，自动生成 .env 文件。
源码运行需 Python 3.10+，并执行 playwright install chromium。
服务启动后 MCP 地址为 http://localhost:8000/mcp。

核心亮点

自动解析设计稿并生成前后端代码，减少手动编码时间
内置切图下载功能，省去设计资源整理环节
基于 MCP 协议，可快速接入主流 AI 编程工具

不足之处

依赖蓝湖生态，对非蓝湖设计稿支持有限
生成代码质量可能受设计稿复杂度和标注完整性影响

适用场景

前端团队快速将设计稿转化为可运行页面
全栈开发中自动生成接口与前端联调代码
设计交付环节自动化提取切图资源

替代项目

screenshot-to-code、Locofy、Anima

项目介绍

lanhu-mcp 是智能体领域的开源项目，由 dsphper 开发，2025 年首次发布。

在全站 13,090 个收录项目中，它的 GitHub 星标数（2,421）位列前 30%，在智能体分类中处于中上游。

近 42 天，它的 GitHub 星标从 2,161 增加到 2,421，净增 260。

项目目前处于活跃维护状态，最近一次代码更新于 2026-09-23。

它主要面向的使用场景是：前端团队快速将设计稿转化为可运行页面。同类可对比的替代方案包括 screenshot-to-code、Locofy、Anima。

上一篇：agterm

下一篇：mirage