$ loading_
将 Figma 设计转为结构化代码上下文,帮助生成可落地前端代码。
复制安装指令,让 AI 自动完成配置 · 推荐新手
"Figma Context MCP" 暂无可直接复制的安装信息,请查看页面文档或源码仓库。
请读取这个 Figma 文件中的登录页面设计,提取布局、颜色、字体、间距和组件层级,整理成适合前端开发的结构化上下文,并生成 React + Tailwind 组件代码。
输出结构化设计上下文,以及可直接使用的 React + Tailwind 登录页组件代码。
分析这个 Figma 设计系统文件,提取颜色、字号、圆角、阴影和间距 token,输出为前端可用的设计令牌格式,并说明各 token 的使用场景。
输出清晰的设计令牌清单与前端样式映射说明,便于统一开发实现。
根据这个 Figma 电商商品详情页,整理页面结构、响应式断点、交互元素和组件拆分建议,生成供 AI 编码代理使用的开发规范上下文。
输出适合 AI 生成代码的页面开发规范,包括结构、样式和组件拆分建议。
让编码代理读取 Figma 设计数据并一键生成前端实现代码