figma-tools-and-prompts

# Figma 智能体工具与提示词模式 Figma 智能体工具集的快速参考，何时使用每个工具，以及将输出导向您的技术栈的提示词示例。 ## 核心工具 - `get_design_context` (Figma Design, Figma Make): 主要工具。返回结构化设计数据和默认的 React + Tailwind 代码。基于选择的提示词在桌面端有效；远程服务器使用框架/图层链接来提取节点 ID。 - `get_variable_defs` (Figma Design): 列出选择中使用的变量/样式（颜色、间距、排版）。有助于与令牌对齐。 - `get_metadata` (Figma Design): 图层 ID/名称/类型/位置/尺寸的稀疏 XML 大纲。在大型节点上重新调用 `get_design_context` 之前使用，以避免截断。 - `get_screenshot` (Figma Design, FigJam): 用于视觉保真度检查的选择截图。 - `get_figjam` (FigJam): 用于 FigJam 图表（架构、流程）的 XML + 截图。 - `create_design_system_rules` (无文件上下文): 生成带有针对您技术栈的设计转代码指导的规则文件。将其保存到智能体可以读取的地方。 - `get_code_connect_map` (Figma Design): 返回 Figma 节点 ID 到代码组件的映射 (`codeConnectSrc`, `codeConnectName`)。用于重用现有组件。 - `add_code_connect_map` (Figma Design): 添加/更新 Figma 节点与代码组件之间的映射，以提高重用性。 - `get_strategy_for_mapping` (alpha, 仅限本地): Figma 提示词工具，用于决定将节点连接到代码组件的映射策略。 - `send_get_strategy_response` (alpha, 仅限本地): 在 `get_strategy_for_mapping` 之后发送响应。 - `whoami` (仅限远程): 返回已认证的 Figma 用户身份（电子邮件、计划、席位类型）。 ## 提示词模式（设计上下文） - 更改框架：“用 Vue 生成我的 Figma 选择”或“用纯 HTML + CSS”或“用于 iOS”。 - 使用我的组件：“使用 `src/components/ui` 中的组件生成我的 Figma 选择”。 - 组合：“使用 `src/ui` 中的组件生成我的 Figma 选择，并用 Tailwind 设置样式”。 - 注意：在远程服务器上，基于选择的提示词需要框架/图层链接；服务器从 URL 中提取节点 ID。 ## 提示词模式（变量/样式） - “获取我的 Figma 选择中使用的变量” - “我的 Figma 选择中使用了哪些颜色和间距变量？” - “列出我的 Figma 选择中使用的变量名称及其值” ## 提示词模式（代码连接） - “显示此选择的代码连接映射” - “将此节点映射到 `src/