skills.rest
MinBZK
MinBZKOFFICIAL
Explore all skills by this author →
WebsiteGitHub

figma-navigator

Retrieve Figma component data and assets using fileKey and nodeId.

20|4|Updated Nov 10, 2025
Search Tags:#figma#design-system#component-lookup#figma-data#asset-download#token-synchronization
One-click install
npx skills add https://github.com/MinBZK/regelrecht --skill figma-navigator
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: figma-navigator
Source: https://github.com/MinBZK/regelrecht/tree/main/.claude/skills/figma-navigator
Command: npx skills add https://github.com/MinBZK/regelrecht --skill figma-navigator

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides quick access to the RegelRecht Figma design system data, enabling fast lookups, design comparisons, and asset retrieval for UI components.

Core Features & Use Cases

  • Look up Figma node IDs and component structure within the RR Components reference.
  • Compare Figma specifications with implementation and download assets or tokens as needed.
  • Activate automatically when users mention Figma, design systems, RR-Components, or component styling queries.

Quick Start

Fetch the Figma data for a specific component by providing its file key and node ID.

Frequently Asked Questions about figma-navigator

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I look up Figma node IDs for design system components?▼

To look up Figma node IDs, you can use tokenized MCP tools to fetch precise component details and structure by providing the specific file key and node ID for your UI design components.

Can I download Figma assets and compare design specs with code?▼

Yes, you can download Figma images and compare design specifications with your code implementation by retrieving component data and assets using the get_figma_data and download_figma_images tools.

How do I retrieve Figma data for a specific UI component?▼

You retrieve Figma data by activating the navigator upon mentioning Figma or component styling queries, then supplying the file key and node ID to fetch the exact component details and tokens needed.

When do I need to use token synchronization for Figma design systems?▼

You need token synchronization when comparing Figma specifications with your codebase implementation, ensuring that your UI component styling and design tokens match the reference assets retrieved.

Does this Figma navigator work without external dependencies?▼

Yes, the Figma navigator operates without external dependencies, relying solely on internal tokenized MCP tools to access design system data, look up node IDs, and download component assets.

Related Skills

Explore More Design & Creative Skills→
ahandselahandsel
1

extract-copy-from-figma

Extract UX copy and layer names from Figma nodes into Markdown tables.

Community
Advanced
deangilmoreremixdeangilmoreremix

figma-implement-design

Translate Figma nodes into React components using design system tokens.

Community
Advanced
AradotsoAradotso
3

figma-context-mcp-cached

Cache Figma design data locally to serve repeated MCP requests.

Official
Intermediate
tankpkgtankpkg
1

@tank/figma-to-code

Translate Figma designs into CSS and component structures.

Official
Advanced