10 分钟上手「设计稿转代码」Skill：从零到第一次跑通
10 分钟跑通设计稿转代码 Skill：准备材料、写最小指令、放进工具、运行一次、修正一处，附可复制的最小指令模板。适用于前端工程师的日常工作。示例均为示意，以平台官方文档为准。
阅读全文 →标签：设计稿转代码
设计稿转代码智能体 Skill 专题：32 篇，根据设计稿截图或标注生成页面结构代码。含 16 个平台版本与介绍、SKILL.md、测试、安全、组合、定制等角度。
设计稿转代码智能体 Skill 专题：32 篇，根据设计稿截图或标注生成页面结构代码。含 16 个平台版本与介绍、SKILL.md、测试、安全、组合、定制等角度。
用 LangGraph 实现「设计稿转代码」：工具定义与智能体代码
在LangChain / LangGraph 工具上实现设计稿转代码技能：根据设计稿截图或标注生成页面结构代码。本文给出示意配置、启用步骤、一次完整运行、测试方法与常见坑，适合前端工程师参考。
阅读全文 →设计稿转代码 Skill 介绍：让智能体按固定流程完成任务
介绍设计稿转代码智能体 Skill：它能根据设计稿截图或标注生成页面结构代码，适合哪些人、不适合哪些场景，可在哪些平台实现，以及从提示词到技能包的上手路径。适用于前端工程师的日常工作。
阅读全文 →「设计稿转代码」Skill 极简版与进阶版：怎么选、怎么升级
设计稿转代码 Skill 的极简版与进阶版对比：五行提示词与完整技能包各自适合什么情况，什么时候该升级，附示例与对比表。适用于前端工程师的日常工作。示例均为示意，以平台官方文档为准。
阅读全文 →Claude Code Skill 实战：设计稿转代码的目录结构与示例
在Claude Code Skill上实现设计稿转代码技能：根据设计稿截图或标注生成页面结构代码。本文给出示意配置、启用步骤、一次完整运行、测试方法与常见坑，适合前端工程师参考。
阅读全文 →设计稿转代码 Skill 效果评估方法：样例集、评分维度与迭代
评估设计稿转代码 Skill 是否好用：建立样例集，按完整性、准确性、流程遵循、边界处理与可用性打分，并做回归测试。适用于前端工程师的日常工作。示例均为示意，以平台官方文档为准。
阅读全文 →用 Gemini CLI 做设计稿转代码：命令文件与 GEMINI.md 配合
在Gemini CLI上实现设计稿转代码技能：根据设计稿截图或标注生成页面结构代码。本文给出示意配置、启用步骤、一次完整运行、测试方法与常见坑，适合前端工程师参考。
阅读全文 →给「设计稿转代码」Skill 写测试用例：6 类输入与预期行为
为设计稿转代码 Skill 设计 6 类测试输入：正常、缺信息、矛盾、超长、提示注入与越权请求，附预期行为、检查点与判定标准。适用于前端工程师的日常工作。示例均为示意，以平台官方文档为准。
阅读全文 →扣子工作流实战：搭一个设计稿转代码智能体
在扣子（Coze）智能体与工作流上实现设计稿转代码技能：根据设计稿截图或标注生成页面结构代码。本文给出示意配置、启用步骤、一次完整运行、测试方法与常见坑，适合前端工程师参考。
阅读全文 →「设计稿转代码」的 SKILL.md 怎么写：逐段拆解与完整示例
以设计稿转代码为例逐段讲解 SKILL.md：name、description 怎么写才能被正确触发，步骤、输出与约束如何组织，附完整示例与目录结构。适用于前端工程师的日常工作。
阅读全文 →n8n 实战：自动化执行设计稿转代码的智能体流程
在n8n AI Agent上实现设计稿转代码技能：根据设计稿截图或标注生成页面结构代码。本文给出示意配置、启用步骤、一次完整运行、测试方法与常见坑，适合前端工程师参考。
阅读全文 →设计稿转代码 Skill 上传到 Claude 应用的完整流程
在Claude 应用中的 Skills上实现设计稿转代码技能：根据设计稿截图或标注生成页面结构代码。本文给出示意配置、启用步骤、一次完整运行、测试方法与常见坑，适合前端工程师参考。
阅读全文 →