Lanhu MCP
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Lanhu MCPParse this Lanhu design and generate iOS code: https://lanhuapp.com/d/abc"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Lanhu MCP
面向 AI 编程的蓝湖(Lanhu)设计稿 MCP Server。把设计稿解析成结构化图层树,枚举 iOS / Android / Flutter 客户端开发所需的全部视觉属性与布局关系,并内置切图清单与按需加载——不依赖 DDS「设计图转代码」,任何稿子都能稳定读取。
目录
Related MCP server: lanhu-mcp-server
为什么用它
不依赖 DDS,稳定不失败 — 直接清洗蓝湖原始 Sketch / Figma / MasterGo JSON,设计师未开启「设计图转代码」也照常工作。
属性齐全,面向客户端 — 坐标/尺寸/字号统一逻辑点
pt,颜色统一干净rgb()/rgba();覆盖颜色、渐变、边框、逐角圆角、阴影、模糊、透明度、旋转、裁剪、字体全套,直接对应 iOS 属性。父子 + 兄弟布局 — 嵌套
children图层树;容器带padding(子相对父)与gaps{direction,gap,align}(兄弟方向/间距/对齐),直接映射UIStackView/LinearLayout,配合绝对坐标完整还原。超省 token,按需加载 — 默认智能渐进:小稿一次到位,大稿返回带唯一
id的浅骨架,再按id逐分支展开;几百项的超宽列表可child_offset翻页,不会因 MCP 输出上限而漏取。切图不丢 — 图片节点内联下载
imageUrl,顶层slices[]汇总;批量下载与命名交给专用工具。
快速开始
1. 安装(Python 3.10+)
git clone https://github.com/JmoVxia/lanhu-mcp.git
cd lanhu-mcp
python3 -m venv venv
./venv/bin/pip install -r requirements.txt2. 配置蓝湖 Cookie
浏览器登录 lanhuapp.com → F12 → Network → 刷新 → 点任意 lanhuapp.com 请求 → Headers → 复制请求头里 Cookie: 的整段值(图文详版见 GET-COOKIE-TUTORIAL.md)。填入 .env:
cp .env.example .envLANHU_COOKIE=粘贴整段CookieCookie 会过期,失效后按同样方法更新。其余可选项(
DATA_DIR/LOG_LEVEL/HTTP_TIMEOUT…)见.env.example。
3. 接入 MCP 客户端(Claude Code / Cursor 等,stdio)
run-stdio.sh 会自动加载同目录 .env,Cookie 放 .env 即可;也可直接写进 env。
{
"mcpServers": {
"lanhu": {
"command": "/bin/bash",
"args": ["/绝对路径/lanhu-mcp/run-stdio.sh"],
"env": { "LANHU_USER_NAME": "yourname", "LANHU_USER_ROLE": "Developer" }
}
}
}4. 使用 — 把设计链接交给 AI:
用 lanhu_get_design_structure 解析这个设计稿并生成 iOS 代码:
https://lanhuapp.com/web/#/item/project/detailDetach?pid=xxx&image_id=xxx工具一览
工具 | 说明 |
| ⭐ 主力:结构化图层树,枚举全部客户端属性 + 切图内联 + 智能按需加载 |
| 批量下载切图资源,自动分类命名 |
| 获取项目下的设计图列表 |
| 生成 HTML+CSS(可选/遗留,走 DDS,属性以 |
| 原型 / Axure / 需求文档(PRD) |
| 解析邀请链接 · 项目成员 |
| 团队留言 / 协作评论 |
design_structure 属性参考
坐标 / 尺寸 / 字号均为逻辑点 pt,颜色为干净 rgb()/rgba()。每个节点带稳定唯一 id(定位句柄)、name、type(container/text/shape/image)。
分组 | 字段 |
布局 |
|
外观 |
|
文本 |
|
切图 |
|
主题 | 顶层 |
示例(片段):
{
"id": "2:1042", "name": "标题栏", "type": "container",
"x": 0, "y": 44, "width": 375, "height": 44,
"color": "rgb(255,255,255)",
"padding": { "left": 16, "top": 12, "right": 16, "bottom": 12 },
"gaps": { "direction": "row", "gap": 8, "align": "center" },
"children": [
{ "id": "2:1043", "name": "返回", "type": "image",
"imageUrl": "https://.../back.png", "format": "png", "category": "icon",
"x": 16, "y": 54, "width": 24, "height": 24 },
{ "id": "2:1044", "name": "页面标题", "type": "text", "text": "我的",
"fontSize": 17, "fontWeight": 500, "color": "rgb(34,34,34)", "align": "center" }
]
}iOS 映射:color→backgroundColor · radius→layer.cornerRadius(逐角用 maskedCorners)· border→layer.borderWidth/borderColor · shadow→layer.shadow* · blur→UIVisualEffectView · opacity→alpha · clip→clipsToBounds · gradient→CAGradientLayer(用 angle/from/to 定方向)· gaps→UIStackView(axis/spacing/alignment)。
按需加载与超大设计稿
目标:用最少的 token 精确读取,且再大的稿也不会因 MCP 输出上限而漏取。
lanhu_get_design_structure 的参数:
参数 | 作用 |
(默认,无参) | 智能渐进:小稿一次全量;中大稿自动返回「能放进 token 预算的最大深度骨架」,被截断的容器标记 |
| 展开某节点子树( |
| 配合 |
| 显式只输出到第 N 层 |
| 段级白名单( |
机制:完整树始终解析并写盘(savedTo),返回体只给当前所需。同一版本重复读取/逐分支展开走进程内缓存(json_url 版本键),跳过重复下载与解析;版本变化自动失效。
典型流程:
默认调用 → 浅骨架(每节点带 id,truncated 容器带 childCount)
→ node_id=<目标容器 id> 展开该分支
→ 若是超宽列表:child_offset=0 / nextChildOffset 逐页翻架构原则:不依赖 DDS
这是架构级约束,不是可选项:
为什么 — 大量蓝湖稿未开启「设计图转代码」(DDS
store_schema_revise)。以 DDS 为主链路的方案遇到这类稿会失败或残缺。怎么做 — 核心链路一律走
/api/project/image的原始设计 JSON,由design_structure.py清洗成图层树。lanhu_get_design_structure/lanhu_get_design_slices全程零 DDS。边界 — 仅
lanhu_get_ai_analyze_design_result(生成 HTML,可选/遗留)会尝试 DDS,且不可用时自动降级为原始 JSON 的 sketch-HTML,不硬依赖。
隐私与凭据
不自动登录、不采集账号信息。 服务只用你手动配置的
LANHU_COOKIE,以你的身份调用蓝湖官方接口。Cookie 仅存本地
.env(已被.gitignore忽略,不进版本库);data/、logs/同样忽略。内置 Playwright 仅用于跟随蓝湖前端跳转(邀请/detail 链接),复用你提供的 Cookie,不做任何凭据抓取。
测试
./venv/bin/python -m pytest tests/ -q致谢
基于 dsphper/lanhu-mcp(MIT)二次开发。
图层树 / 切图分类思路参考 starql/lanhu-mcp;稳定
node_id寻址、按需加载参考 Framelink Figma MCP。
License
MIT · Copyright (c) 2025 Lanhu MCP Server Contributors · Copyright (c) 2026 JmoVxia
This server cannot be installed
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Connectors
Convert Revit files to XKT, IFC, or DWG and query BIM data via natural language.
Turn any live website into brand colors, fonts, design tokens, SVGs, Lottie and paste-ready code.
Access and maintain design system docs, tokens, components, skills, and contexts across any project.
AI Hub for AEC — 50+ 3D formats, clash detection, ACC integration via Autodesk Platform Services.
Related MCP Servers
- AlicenseAqualityAmaintenanceEnables AI to directly read and analyze Lanhu design drafts and requirement documents to generate HTML, CSS, and structural analyses. It allows users to extract design slices and process prototype pages directly within AI clients.3347116MIT
- AlicenseAqualityBmaintenanceEnables AI coding tools to read Lanhu design data and automate Design to Code, including project browsing, layer tree extraction, DDS semantic components, and code generation.142291MIT
- AlicenseAqualityCmaintenanceA read-only MCP server for reading and analyzing Lanhu (Blue Lake) design projects, providing tools to retrieve design lists, previews, node trees, schemas, and exportable resources.5MIT
- AlicenseAqualityAmaintenanceMCP server for macOS that reads Lanhu designs, analyzes UI structures, and exports fine-grained design assets for multiple platforms.85MIT
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/JmoVxia/lanhu-mcp'
If you have feedback or need assistance with the MCP directory API, please join our Discord server