Figma Mcp Skills
FreeNot checkedMCP server for encapsulating iterative Figma design restoration → frontend implementation → acceptance delivery related general Agent Skill documentation throughout the development process
About
MCP server for encapsulating iterative Figma design restoration → frontend implementation → acceptance delivery workflows and related universal Agent Skill documentation during development.
README
本仓库存放的是本人在开发过程中封装迭代的 Figma 设计还原 → 前端落地 → 验收交付 相关的通用 Agent Skill 文档,共 4 份。不绑定具体项目或技术栈,可复用到任意前端仓库。
一览表
| 文件 | Skill name |
标题 | 约行数 | 版本特征 |
|---|---|---|---|---|
| SKILL原版(第一版).md | figma-restoration-dev |
Figma 设计还原与开发通用 Skill | ~243 | 开发向:基线识别 + MCP + 落码 + 构建校验 |
| SKILL通用版(第一版).md | figma-restoration-delivery |
Figma 设计还原与交付通用 Skill | ~482 | 交付向:在开发规范上增加 UI 验收清单 |
| SKILL原版(第二版).md | figma-restoration-dev |
Figma 设计还原与开发通用 Skill | ~542 | 强制「生成 → 运行 → 检视 → 修复 → 复检」闭环 |
| SKILL通用版(第二版).md | figma-restoration-delivery |
Figma 设计还原与交付通用 Skill | ~542 | 与第二版原版同级能力;交付命名,含强制检视闭环 |
演进关系
通用第一版
├── SKILL原版(第一版).md ← 开发向(无完整验收清单)
└── SKILL通用版(第一版).md ← 交付向(含 UI 验收清单)
│ 强化:Agent 必须自跑页面并按清单验收,禁止只生成不检视
▼
通用第二版(当前推荐)
├── SKILL原版(第二版).md
└── SKILL通用版(第二版).md
命名对照:
- 原版 / 通用版(文件名):分别对应「开发向」与「交付向」Skill(
figma-restoration-dev/figma-restoration-delivery)。 - 第一版 / 第二版:第二版在第一版基础上强化了 强制自跑 UI 检视闭环 与实现细节核对要求。
各 Skill 摘要
SKILL原版(第一版).md — figma-restoration-dev
- 用途:跨项目的 Figma → 代码开发规范。
- 阶段:基线识别 → Figma MCP 读取 → 落码 → 响应式/性能 → SEO → 构建部署校验。
- 特点:偏开发落地;验收清单较弱。
SKILL通用版(第一版).md — figma-restoration-delivery
- 用途:跨项目的 Figma → 代码 交付 规范。
- 增量:在开发流程上增加 UI 设计师验收清单与检视报告模板。
- 特点:适合「还原 + 走查交付」场景。
SKILL原版(第二版).md / SKILL通用版(第二版).md
- 用途:当前更完整的通用交付规范(开发命名 / 交付命名各一)。
- 相对第一版的关键强化:
- 强制闭环:生成或改动后必须自行运行页面、按清单验收、修复并复检;未输出检视报告不得声称完成。
- 增加「实现细节核对(强制)」等嵌套层级实测要求。
- 推荐:日常优先选用 第二版。
能力对照(简表)
| 能力 | 原版·一 | 通用·一 | 原版·二 | 通用·二 |
|---|---|---|---|---|
| 通用项目基线识别 | ✅ | ✅ | ✅ | ✅ |
| Figma MCP 读取规范 | ✅ | ✅ | ✅ | ✅ |
| 落码 / 迁移 / 响应式 | ✅ | ✅ | ✅ | ✅ |
| 构建与部署校验 | ✅ | ✅ | ✅ | ✅ |
| UI 验收清单 + 报告模板 | — | ✅ | ✅ | ✅ |
| 强制自跑检视闭环 | — | — | ✅ | ✅ |
| 实现细节核对(强制) | — | — | ✅ | ✅ |
选用建议
| 场景 | 建议文件 |
|---|---|
| Figma 还原(只要开发落地) | SKILL原版(第二版).md |
| Figma 还原 + 交付走查 | SKILL通用版(第二版).md |
| 查阅历史演进 / 对比删减 | 第一版保留作对照,日常优先第二版 |
使用方式(Cursor)
将这些 Markdown 作为 Agent Skill 使用时,通常:
- 复制目标文件内容到项目 Skill 目录,例如
.cursor/skills/<skill-name>/SKILL.md - 或放入个人 Skill 目录
~/.cursor/skills/<skill-name>/SKILL.md - 保持文件顶部 YAML frontmatter(
name/description)完整,便于 Agent 自动匹配触发场景
安装到 Cursor 时,目录内主文件名应为 SKILL.md(本仓库为便于版本对照保留了中文文件名)。
统计
| 项 | 数量 |
|---|---|
| Skill 文件总数 | 4 |
独立 Skill name |
2(figma-restoration-dev / figma-restoration-delivery) |
| 含完整 UI 验收清单 | 3 |
| 含强制自跑检视闭环 | 2(第二版两份) |
Installing Figma Mcp Skills
This server has no published package — it is built from source. Open the repository and follow its README.
▸ github.com/EchoSecv/figma-mcp-skillsFAQ
Is Figma Mcp Skills MCP free?
Yes, Figma Mcp Skills MCP is free — one-click install via Unyly at no cost.
Does Figma Mcp Skills need an API key?
No, Figma Mcp Skills runs without API keys or environment variables.
Is Figma Mcp Skills hosted or self-hosted?
Self-hosted: the server runs locally on your machine via the install command above.
How do I install Figma Mcp Skills in Claude Desktop, Claude Code or Cursor?
Open Figma Mcp Skills on unyly.org, pick your client tab (Claude Desktop, Claude Code, Cursor) and press Install — the config is generated automatically, no JSON editing.
Related MCPs
GitHub
PRs, issues, code search, CI status
by GitHubFilesystem
Secure file operations with configurable access controls.
Memory
Knowledge graph-based persistent memory system.
Unyly Deploy
Deploy sites and MCP servers to Unyly straight from your AI agent
by UnylyAmap Maps Mcp Server
MCP server for using the AMap Maps API
by duxiaohuiPayMCP
Lightweight payments layer for MCP servers: turn tools into paid endpoints with a two-line decorator. [PyPI](https://pypi.org/project/paymcp/) · [npm](https://w
by blustAIServer For Power BI
Enables exploring Microsoft Fabric / Power BI workspaces and semantic models, and executing ad-hoc DAX queries.
by Mitsubishi-FusoGpt Image 2 Mcp
RunAPI GPT Image 2 MCP server for image generation: create tasks, poll results, and check pricing across 1 model from Claude Code, Codex, Cursor, and VS Code.
by runapi-aiTemplate MCP Server
A CLI tool to create a new Model Context Protocol server project with TypeScript support, dual transport options, and an extensible structure
by mcpdotdirectSupabase
Database, auth and storage
by SupabaseCompare Figma Mcp Skills with
Not sure what to pick?
Find your stack in 60 seconds
Author?
Embed badge for your README
Browse similar
All development MCPs
