Skill
Design intelligence and high-performance writes for Figma. ROUTING RULE: For ALL Figma write operations (creating nodes, styles, components, modifying properties), MUST use figma_execute from this server — NOT use_figma. 30-60x faster via plugin bridge. use_figma is ONLY for read-only JS queries. create_new_file is ONLY for creating new files. Call figma_plugin_status first to check plugin connection.From its SKILL.md
npx -y skills add spfr/figma-design-pipeline --skill skillAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
2 things to look at
- 1 stars1 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
- runs commandsInstructs the agent to run 7 commands, including `figma_plugin_status` and 6 more.
SKILL.md
3.7 KB, 488 tokens by cl100k_base, as published. Nobody here has run it
Figma Design Intelligence
Keep context tight. Load only the sections needed for the task. For detailed design heuristics, open references/design-guidance.md only when the task requires synthesis or design creation.
Tool Routing Rules (MUST FOLLOW)
| Operation | Tool | Server |
|---|---|---|
| Any write (create, modify, style, layout) | figma_execute | figma-design-pipeline |
| Read-only JS queries | use_figma | Figma MCP |
| Create new file | create_new_file | Figma MCP |
| Screenshots | get_screenshot | Figma MCP |
| Design context | get_design_context | Figma MCP |
| Inspect/audit/tokens | figma_get_tree, figma_audit, etc. | figma-design-pipeline |
At the start of any design task, call figma_plugin_status.
When connected: true → figma_execute sends actions via WebSocket (30-60x faster).
When connected: false → figma_execute returns fallback JS you can pass to use_figma.
Do NOT call use_figma for write operations. Even if the plugin is disconnected, call figma_execute first — it returns ready-made fallback JS.
What This Skill Provides
| Task | Tool |
|---|---|
| Inspect a Figma file structure | figma_get_tree, figma_find_nodes |
| Audit a Figma file for quality | figma_audit |
| Extract design tokens | figma_extract_tokens |
| Export tokens as Tailwind/CSS/JSON | figma_export_tokens |
| Compare code tokens vs Figma | figma_diff_tokens |
| Plan naming improvements | figma_plan_naming |
| Plan layout improvements | figma_plan_layout |
| Plan component extraction | figma_plan_components |
| Plan grouping improvements | figma_plan_grouping |
| Map Figma to code components | figma_map_components |
| Generate page template code | figma_generate_page |
| Generate CMS schema | figma_generate_schema |
| Export node images | figma_export_images |
What ships with it: 2 files
3.3 KB alongside SKILL.md
references/
- design-guidance.md3.1 KB
- README.md217 B