fec-implement-from-design SKILL.md skillA
fec-implement-from-design from bovinphang/frontend-craft is an agent skill: a SKILL.md folder an AI agent loads when a task calls for it.
mdr add bovinphang/frontend-craft/fec-implement-from-design@git:20260611.9d7f5e4Pins git:20260611.9d7f5e4 in mdr.lock. Pin the fingerprint instead.
- Audit grade
- A, 17 of 17 checks passed
- Kind
- SKILL.md skill
- Repository
- bovinphang/frontend-craft
- Path
localized/zh-CN/skills/fec-implement-from-design/SKILL.md- Versions recorded
- 1
- Latest version
- git:20260611.9d7f5e4, committed Jun 11, 2026
- Size
- 6,199 bytes
- Repository stars
- 22
- License
- MIT
用于根据 Figma、Sketch、MasterGo、Pixso、墨刀、摹客、截图、设计选区、设计 Token 或设计转代码任务实现生产级前端组件/页面；中文触发词包括 设计稿、按设计实现。.
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# 按设计稿实现 ## 用途 基于设计工具（Figma、Sketch、MasterGo、Pixso、墨刀、摹客）的设计上下文，高保真实现页面或组件，强调组件复用、设计 Token 映射、可访问性和面向生产的前端实现。 ## 支持的设计工具 | 工具 | MCP 集成 | 获取设计数据方式 | | -------- | ------------------------- | ----------------------------------------- | | Figma | `figma` / `figma-desktop` | API 获取设计结构、变量定义 | | Sketch | `sketch` | MCP 获取设计选区截图 | | MasterGo | `mastergo` | API 获取 DSL 结构数据 | | Pixso | `pixso` | 本地 MCP 获取帧数据和代码 | | 墨刀 | `modao` | MCP 获取原型数据、生成设计描述 | | 摹客 | 无 MCP | 通过用户提供的截图、标注或导出的 CSS 获取 | ## 目标 - 尽量高还原地实现设计稿 - 在创建新组件前优先复用现有项目组件 - 尽可能把设计变量映射到现有 Token - 保持实现结果可维护、类型明确、可测试且具备可访问性 - 避免引入重复的基础组件或并行设计系统 ## 流程 ### 1. 识别设计来源 按优先级选择设计数据获取方式： - `figma` — Figma API 集成 - `figma-desktop` — Figma 桌面端集成 - `mastergo` — MasterGo DSL 数据 - `pixso` — Pixso 本地 MCP - `modao` — 墨刀原型数据 - `sketch` — Sketch 选区截图 - 如以上 MCP 均不可用，请求用户提供设计截图或标注（适用于摹客等无 MCP 工具） - 如果没有权威设计稿，但任务明确要求视觉型网站、品牌页、作品集或高审美重设计，可把用户提供或本地生成的分区级参考图作为临时视觉事实来源；这种来源必须先分析后实现，并在计划中标明不是权威设计系统。 ### 2. 读取设计上下文 …
Read the whole file at its exact version.
How to install
mdr add bovinphang/frontend-craft/fec-implement-from-design@sha256:6c245920b6ec02e8The line at the top of this page pins the label git:20260611.9d7f5e4, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
[](https://markdownregistry.com/a/art_5xnlurgis5ana7pk)
2 badge image fetches in 30 days. What the badge shows.
Versions
The registry has recorded 1 version of this file, committed on Jun 11, 2026.
Audit of the latest version
- pass: Frontmatter block present
- pass: Frontmatter declares a name
- pass: Frontmatter declares a description
- pass: Size between 200 bytes and 200 KB (6199 bytes)
- pass: No zero-width or bidi control characters
- pass: No instruction hidden inside an HTML comment
- pass: No link to an exfiltration or paste host
- pass: No credential-shaped string
- pass: No instruction to send local credentials anywhere
- pass: No text hidden with inline styles
- pass: No prompt-injection phrasing
- pass: No curl or wget piped into a shell
- pass: No recursive delete of root, home or parent
- pass: No instruction to read or print local credentials
- pass: No base64 blob over 200 characters
- pass: No link to a raw IP address
- pass: No script tag
Source
bovinphang/frontend-craft · 22 stars · license MIT · pushed 2026-09-26 · branch main
API
GET https://markdownregistry.com/api/v1/artifacts/art_5xnlurgis5ana7pk GET https://markdownregistry.com/api/v1/resolve?ref=bovinphang/frontend-craft/fec-implement-from-design GET https://markdownregistry.com/api/v1/blob/6c245920b6ec02e8f4a3cad17b1afdc45689f68cf7639221867126f389ae6847
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
Guides: the SKILL.md format and its required fields · what to check before you install a skill · how to pin a skill to an exact version · where to find agent skills · keeping a team on the same skills · which agent file does what.
More from bovinphang/frontend-craft
Every file in bovinphang/frontend-craft