🌚 КиберПоток | ИИ & Нейросети
Telegram ·
ИИ-агент САМ рисует макеты в Figma — Figma Console MCP
Figma Console MCP — бесплатный открытый мост между десктопной Figma и Claude Code, Codex или Cursor. Через него агент получает 130 инструментов и сам правит открытый макет: слои, компоненты, переменные.
Внутри Figma Console MCP
// ЧТО УМЕЕТ
├ Рисует сам: создаёт и правит фреймы, фигуры, текст и компоненты прямо в открытом файле
├ Ведёт дизайн-систему: заводит переменные и токены, выгружает их в 10 форматов, от CSS до Tailwind
├ Видит твои правки: что выделено и что поменялось в файле, сразу, без перезагрузки
└ Проверяет макет: ищет проблемы с доступностью и сверяет компонент с кодом
// СКОЛЬКО СТОИТ
├ Ноль рублей: код открыт под MIT, мост крутится у тебя на компе
└ Тариф Figma не важен: работает и на бесплатном, даже с переменными, которые обычный API Figma отдаёт только в Enterprise
Что важно: плагин-мост ставится только в десктопную Figma, из браузерной версии агент к макету не подключится.Шаг 0 — что понадобится Готовим комп Шаг · Действие 1 · ставим десктопную Figma с официального сайта 2 · ставим Node.js 18 или новее с nodejs.org, на нём работает мост 3 · открываем терминал: на Windows жмём Win+X → «Терминал» или PowerShell, на маке «Терминал» лежит в «Утилитах». Проверяем Node командой node --version, команды вставляем по одной и ждём, пока терминал снова будет готов 4 · нужен сам агент: Claude Code или Codex. Сервер не нужен, мост работает на твоём компе, пока открыт агент Шаг 1 — токен и подключение Токен берём в Figma: меню аккаунта → Settings → Security → Personal access tokens → Generate new token. Права ставим Read у File content, File versions, Library content, Library assets и Current user, а у Comments — Read и Write. Токен начинается с figd_ и показывается один раз, сразу копируем. Дальше одна команда в терминал, вместо figd_ВАШ_ТОКЕН вставляем свой: Подключаем к агенту Агент · Команда (нажми, чтобы скопировать) Claude Code · claude mcp add figma-console -s user -e FIGMA_ACCESS_TOKEN=figd_ВАШ_ТОКЕН -e ENABLE_MCP_APPS=true -- npx -y figma-console-mcp@latest Codex · codex mcp add figma-console --env FIGMA_ACCESS_TOKEN=figd_ВАШ_ТОКЕН --env ENABLE_MCP_APPS=true -- npx -y figma-console-mcp@latest Codex ещё просит поднять таймауты: открываем Блокнотом файл .codex\config.toml в папке пользователя, в блок [mcp_servers.figma-console] дописываем две строки и сохраняем Ctrl+S. Строка для config.toml (нажми, чтобы скопировать) startup_timeout_sec = 60 tool_timeout_sec = 300 Шаг 2 — плагин и первый запрос Связываем с Figma Шаг · Действие 1 · перезапускаем агента: закрываем сессию и открываем заново, мост при старте сам кладёт файлы плагина в папку .figma-console-mcp 2 · в Figma жмём Plugins → Development → Import plugin from manifest и выбираем manifest.json: на Windows вставляем в окно выбора путь %USERPROFILE%\.figma-console-mcp\plugin, на маке жмём ⌘⇧G и вставляем ~/.figma-console-mcp/plugin 3 · открываем макет и запускаем Plugins → Development → Figma Desktop Bridge, в плашке плагина загорится «Local · ready» 4 · пишем агенту Check Figma status, потом Create a simple frame with a blue background, и в макете появляется синий фрейм Ссылки GitHub Инструкция 😎КиберПоток/Навигация #гайд #figma #mcp
