figma · figma — плагин для Claude Code: что делает и как установить
Плагин подключает проекты Figma к ИИ-агентам для извлечения стилей, токенов и вёрстки. Он помогает генерировать код по макетам и связывать компоненты через Code Connect.
/plugin install figma@claude-plugins-official
/plugin marketplace add anthropics/claude-plugins-community
/plugin install figma-test@claude-community
/plugin marketplace add anthropics/claude-plugins-officialЧто делает figma
Плагин открывает ИИ-ассистентам доступ к макетам через MCP-сервер https://mcp.figma.com/mcp. Агент считывает параметры слоёв, дизайн-токены, переменные и разметку Auto Layout. С помощью Code Connect модель подставляет в сгенерированный код реальные компоненты из репозитория проекта. Также инструмент умеет создавать плейсхолдеры через функцию generate_image, запрашивая разрешение перед тратой кредитов Figma AI.
У плагина есть жёсткое ограничение для бесплатных аккаунтов. На тарифе Starter и с местами View или Collab действует лимит: не более 6 чтений через инструменты в месяц. Без платного места Dev или Full с тарифом Professional, Organization или Enterprise регулярно верстать макеты не выйдет. Запись на холст пока работает бесплатно в рамках бета-теста, но позже перейдёт на платную модель по объёму использования.
Какие задачи решает
- сгенерировать готовый код по выбранному фрейму
- выгрузить дизайн-токены и переменные макета в проект
- связать компоненты кодовой базы с элементами дизайна через Code Connect
- создать плейсхолдеры для недостающих картинок
Примеры запросов агенту
- Преврати выбранный фрейм Figma в компонент React
- Вытащи цвета и дизайн-токены из макета в CSS-переменные
- Проверь привязку компонентов через Code Connect для экрана профиля
Как установить figma
Через маркетплейс плагинов
/plugin install figma@claude-plugins-official/plugin marketplace add anthropics/claude-plugins-community/plugin install figma-test@claude-community/plugin marketplace add anthropics/claude-plugins-officialКоманда из источника
copilot plugin install figma@awesome-copilotПо шагам, с командами для каждой платформы: Плагины Claude Code: маркетплейсы, установка и как собрать свой
Вопросы о figma
Как установить figma в Claude Code?
Сначала подключите официальный каталог командой /plugin marketplace add anthropics/claude-plugins-official. Затем запустите установку: /plugin install figma@claude-plugins-official.
Какие ограничения действуют на бесплатном тарифе Figma?
Пользователям тарифа Starter доступно не больше 6 вызовов инструментов чтения в месяц. Для активной работы потребуется место Dev или Full на тарифах Professional, Organization или Enterprise.
Что умеет функция записи на холст?
Она позволяет агенту напрямую создавать и менять фреймы, переменные и автолейауты в файле. На этапе беты эта возможность бесплатна, но со временем станет платной.
Похожие плагины
Все плагины по теме «Дизайн» →Сначала — figma от других авторов.
