Back to Details

figma-mcp-downloader

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Figma MCP Downloader

Figma MCP 下载器

Prerequisites

前置条件

  • Figma Desktop app must be running (Local MCP server starts automatically)
  • 必须运行Figma Desktop客户端（本地MCP服务器会自动启动）

Integration with Other Figma Skills

与其他Figma技能的集成

When this CLI and other Figma-related skills (such as 
implement-design
) are triggered together:
  1. First, use this CLI to download complete design context and metadata
  2. Then, proceed with the other skill's workflow using the downloaded files
  3. This ensures 100% complete data before any Figma-related operations begin
当此CLI与其他Figma相关技能（如
implement-design
）一起触发时：
  1. 第一步，使用此CLI下载完整的设计上下文和元数据
  2. 第二步，使用下载的文件继续执行其他技能的工作流
  3. 这可确保在开始任何Figma相关操作前拥有100%完整的数据

Examples

示例

Download design context as JSX

以JSX格式下载设计上下文

bash
npx figma-mcp-downloader get_design_context design_context.jsx -i "123:456" -c -l typescript -f react,tailwindcss
bash
npx figma-mcp-downloader get_design_context design_context.jsx -i "123:456" -c -l typescript -f react,tailwindcss

Download design context with AI guidance

借助AI指导下载设计上下文

bash
npx figma-mcp-downloader get_design_context design_context.json -i "123:456" -l html,css,javascript -f vue
bash
npx figma-mcp-downloader get_design_context design_context.json -i "123:456" -l html,css,javascript -f vue

Download design context with assets

下载包含资源的设计上下文

Use 
-d
to download image, vector, and video assets locally. Requires Figma Desktop's "Image source" to be "Download".
bash
npx figma-mcp-downloader get_design_context design_context.jsx -i "123:456" -c -d /home/user/my-project/src/public/images -l typescript -f react,tailwindcss
使用
-d
参数可将图片、矢量图和视频资源下载到本地。需要将Figma Desktop的“图片来源”设置为“下载”。
bash
npx figma-mcp-downloader get_design_context design_context.jsx -i "123:456" -c -d /home/user/my-project/src/public/images -l typescript -f react,tailwindcss

Download metadata as XML

以XML格式下载元数据

bash
npx figma-mcp-downloader get_metadata metadata.xml -i "123:456" -c -l typescript -f react,tailwindcss
bash
npx figma-mcp-downloader get_metadata metadata.xml -i "123:456" -c -l typescript -f react,tailwindcss

Download metadata with AI guidance

借助AI指导下载元数据

bash
npx figma-mcp-downloader get_metadata metadata.json -i "123:456" -l html,css,javascript -f vue
bash
npx figma-mcp-downloader get_metadata metadata.json -i "123:456" -l html,css,javascript -f vue

CLI Reference

CLI 参考文档

For complete options and detailed usage, see CLI Reference.
如需完整选项和详细用法，请查看CLI参考文档。