·code-connect-components
*

code-connect-components

✓
figma/mcp-server-guideGitHub: figma/mcp-server-guideИсточник: figma/mcp-server-guide

Соединяет компоненты дизайна Figma с компонентами кода с помощью Code Connect. Используйте, когда пользователь говорит «подключить код», «подключить этот компонент к коду», «подключить Figma к коду», «сопоставить этот компонент», «связать компонент с кодом», «создать сопоставление соединения кода», «добавить соединение кода», «соединить дизайн с кодом» или хочет установить сопоставления между проектами Figma и реализациями кода. Требуется подключение к серверу Figma MCP.

figma·code·connect·components
575Установки·25Тренд·@figma

Установка

GitHub: figma/mcp-server-guide
$npx skills add https://github.com/figma/mcp-server-guide --skill code-connect-components

Как установить code-connect-components

Быстро установите AI-навык code-connect-components в вашу среду разработки через командную строку

  1. Откройте терминал: Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.)
  2. Выполните команду установки: Скопируйте и выполните эту команду: npx skills add https://github.com/figma/mcp-server-guide --skill code-connect-components
  3. Проверьте установку: После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw

Источник: figma/mcp-server-guide.

SKILL.md

Показать raw

This skill helps you connect Figma design components to their corresponding code implementations using Figma's Code Connect feature. It analyzes the Figma design structure, searches your codebase for matching components, and establishes mappings that maintain design-code consistency.

When the user provides a Figma URL with file key and node ID, first run getmetadata to fetch the node structure and identify all Figma components.

IMPORTANT: When extracting the node ID from a Figma URL, convert the format:

Соединяет компоненты дизайна Figma с компонентами кода с помощью Code Connect. Используйте, когда пользователь говорит «подключить код», «подключить этот компонент к коду», «подключить Figma к коду», «сопоставить этот компонент», «связать компонент с кодом», «создать сопоставление соединения кода», «добавить соединение кода», «соединить дизайн с кодом» или хочет установить сопоставления между проектами Figma и реализациями кода. Требуется подключение к серверу Figma MCP. Источник: figma/mcp-server-guide.

Факты (для цитирования)

Стабильные поля и команды для ссылок в AI/поиске.

Команда установки
npx skills add https://github.com/figma/mcp-server-guide --skill code-connect-components
Источник
figma/mcp-server-guide
Категория
*Креатив
Проверено
✓
Впервые замечено
2026-02-01
Обновлено
2026-03-10
URL
https://www.learn-skills.dev/ru/skills/figma/mcp-server-guide/code-connect-components

Browse more skills from figma/mcp-server-guide

Короткие ответы

Что такое code-connect-components?

Соединяет компоненты дизайна Figma с компонентами кода с помощью Code Connect. Используйте, когда пользователь говорит «подключить код», «подключить этот компонент к коду», «подключить Figma к коду», «сопоставить этот компонент», «связать компонент с кодом», «создать сопоставление соединения кода», «добавить соединение кода», «соединить дизайн с кодом» или хочет установить сопоставления между проектами Figma и реализациями кода. Требуется подключение к серверу Figma MCP. Источник: figma/mcp-server-guide.

Как установить code-connect-components?

Откройте терминал или инструмент командной строки (Terminal, iTerm, Windows Terminal и т.д.) Скопируйте и выполните эту команду: npx skills add https://github.com/figma/mcp-server-guide --skill code-connect-components После установки навык будет автоматически настроен в вашей AI-среде разработки и готов к использованию в Claude Code, Cursor или OpenClaw

Где находится исходный репозиторий?

https://github.com/figma/mcp-server-guide

Детали

Категория
*Креатив
Источник
skills.sh
Впервые замечено
2026-02-01

Похожие навыки

implement-design
4.1K Установки
create-design-system-rules
847 Установки