alvinindra/figma-mcp-rust/read-design-strategy
Claude Code and agent skill by alvinindra/figma-mcp-rust
- community
Checking that the SKILL.md file is still in the repository.
Token-efficient reading of Figma files with the figma-mcp-rust tools. Use before inspecting any Figma design through this server, when choosing get_design_context detail levels, deduplicating repeated component instances, or drilling into nodes without dumping entire trees.
Install
npx vskill@latest install alvinindra/figma-mcp-rust/read-design-strategySKILL.md
To effectively read a Figma design with figma-mcp-rust:
- Start with get_metadata to understand file name, pages, and current page
- Use get_pages to list all pages without loading their full trees
- Use get_design_context (depth=2, detail=compact) for a token-efficient summary of the current selection or page
- detail=minimal: id/name/type/bounds only (~5% tokens)
- detail=compact: + fills/strokes/opacity (~30% tokens)
- detail=full: everything, default (100% tokens)
- dedupe_components=true: INSTANCE nodes are collapsed to compact stubs (mainComponentId + componentProperties overrides);
unique component structures are collected once in a top-level componentDefs map. Use this whenever the screen contains repeated component instances (e.g. card lists, table rows, nav items). Typical savings: 5-10x fewer tokens vs full serialization of repeated instances.
- For screens with many repeated components, the recommended reading flow is:
a. get_design_context(depth=2, detail=minimal, dedupe_components=true) to see the instance layout and component IDs b. Inspect componentDefs in the response: one definition per unique component, not one per instance c. Read componentProperties on each instance stub for variant selections, text overrides, and boolean toggles d. Drill into specific instances with get_node only when an instance has unique overrides you need to inspect
- Use search_nodes to find nodes by name or type without dumping the entire tree
- Drill into specific nodes with get_node or get_nodes_info (prefer batch over single calls)
- For text-heavy components, use scan_text_nodes to collect all copy at once
- Use scan_nodes_by_types to find all FRAME/COMPONENT/INSTANCE nodes in a subtree
- Call get_styles and get_variable_defs once per session to understand the design system
- Call get_fonts to understand typography usage across the page at a glance
- Use get_viewport to see what the user is currently looking at in the canvas
- Use get_reactions to inspect prototype interactions on a node
- Call get_screenshot last and only when visual confirmation is needed, because it is expensive
- Node IDs use colon format (4029:12345), never hyphens
- get_local_components returns componentSets and variantProperties for variant-aware inspection
Security
- Security scanPassed, 100 of 100Pattern checks on the skill's files.
- Model reviewNot runA model review is scheduled for the next rescan.
Quality evaluation
- Task evaluationNot runNo evaluation yet. Run one in Skill Studio.
Source
- SKILL.md in the repositoryCheckingskills/read-design-strategy/SKILL.md
Popularity
- Repository stars
- 69
- Repository forks
- 27
- 7-day trend score
- 0
Stars and forks are for the whole GitHub repository, not this skill alone. Not refreshed yet.
Works with
Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.
- Claude Code
- Cursor
- GitHub Copilot
- Windsurf
- Codex
- Gemini CLI
- Cline
- Amp
- Roo Code
- Goose
- Continue
- Kilo Code
- Junie
- Trae
- OpenHands
- Qwen Code
- AI Agent
- Tabnine Chat
- Sourcegraph Cody
- Amazon Q
- Firebase Genkit
- Sweep
- Devin
- Phind
- Mentat
- Claude Desktop
- Aider
- GPT Pilot
- Plandex
- bolt.new
- v0
- Replit Agent
- Anse
- TypingMind
- BetterChatGPT
- LibreChat
- Warp AI
- Pieces
- Fig AI
Embed badge
[](https://verified-skill.com/skills/alvinindra/figma-mcp-rust/read-design-strategy)