figma-mcp-downloader
Original:🇺🇸 English
Translated
CLI for downloading complete Figma design context and metadata to local files. Always use this CLI instead of calling Figma MCP tools (`get_design_context`, `get_metadata`) directly. Direct MCP tool calls risk incomplete data due to context limits. This CLI guarantees 100% complete output.
10installs
Added on
NPX Install
npx skill4agent add yuichiroharai/figma-mcp-downloader figma-mcp-downloaderTags
Translated version includes tags in frontmatterSKILL.md Content
View Translation Comparison →Figma MCP Downloader
Prerequisites
- Figma Desktop app must be running (Local MCP server starts automatically)
Integration with Other Figma Skills
When this CLI and other Figma-related skills (such as ) are triggered together:
implement-design- First, use this CLI to download complete design context and metadata
- Then, proceed with the other skill's workflow using the downloaded files
- This ensures 100% complete data before any Figma-related operations begin
Examples
Download design context as JSX
bash
npx figma-mcp-downloader get_design_context design_context.jsx -i "123:456" -c -l typescript -f react,tailwindcssDownload design context with AI guidance
bash
npx figma-mcp-downloader get_design_context design_context.json -i "123:456" -l html,css,javascript -f vueDownload design context with assets
Use to download image, vector, and video assets locally. Requires Figma Desktop's "Image source" to be "Download".
-dbash
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,tailwindcssDownload metadata as XML
bash
npx figma-mcp-downloader get_metadata metadata.xml -i "123:456" -c -l typescript -f react,tailwindcssDownload metadata with AI guidance
bash
npx figma-mcp-downloader get_metadata metadata.json -i "123:456" -l html,css,javascript -f vueCLI Reference
For complete options and detailed usage, see CLI Reference.