Короткий ответ
Основной инструмент здесь — MCP-сервер Figma, который работает в режиме разработки (Dev Mode). Он запускается вместе с настольным приложением Figma и отдаёт агенту не картинку, а структуру макета: размеры, отступы, цвета, названия слоёв и переменных.
Разница принципиальная. Скриншот агент вынужден разглядывать и угадывать, что там за отступ — 16 пикселей или 18. Через MCP он читает точное значение.
Что это меняет на практике
Обычная история без MCP: вы кидаете агенту скриншот и просите сверстать. Он выдаёт похожее, но цвета чуть другие, отступы гуляют, а вместо ваших компонентов появляются выдуманные.
С подключённым макетом появляется другая возможность: агент видит, что этот прямоугольник — компонент «Кнопка/Основная», а цвет — не #4F46E5, а переменная accent/primary. И в коде он использует ваш существующий компонент вместо того, чтобы рисовать новый.
Это, кстати, главная польза, а вовсе не «сверстает за вас». Экономит не написание разметки, а разбирательство, почему свёрстанное не совпадает с макетом.
Что нужно, чтобы запустить
Три вещи, и на каждой люди спотыкаются.
Настольное приложение Figma, а не браузер. Сервер поднимается локально самим приложением, вкладка в браузере так не умеет.
Подходящий тариф и роль. Режим разработки доступен не на всех планах и не всем участникам файла. Если пункта в меню нет, дело почти всегда в этом, а не в настройке.
Выделенный фрейм. Агент читает то, что выбрано. Просьба «свёрстай экран» при пустом выделении даёт пустой ответ.
Дальше сервер прописывается в вашего агента обычным образом — как удалённый сервер по адресу. Порядок для конкретных редакторов: Cursor, Codex, Claude Code.
Кроме Figma
Сообщество написало серверы и для соседних задач: сравнить свёрстанную страницу с макетом и показать расхождения, собрать токены дизайн-системы из кода и из Figma в один источник, дать агенту править сам макет, а не только читать.
Качество у них разное, официальной поддержки нет. Брать такой сервер стоит, понимая, что он получает доступ к вашим файлам — про это есть отдельный разбор рисков MCP.
Чего ждать не стоит
Макет не содержит логики. В нём нет информации о том, что происходит при нажатии, откуда берутся данные и что показывать при ошибке. Агент получит форму, но не поведение, и всё это придётся объяснять словами.
Не стоит рассчитывать и на сложную анимацию: то, что дизайнер держит в голове или показывает в прототипе, в структуру макета не попадает.
Реалистичная польза — точная статика и переиспользование ваших компонентов. Этого достаточно, чтобы сэкономить заметное время, но это не «дизайн превращается в готовый продукт нажатием кнопки».
Если вы только разбираетесь, зачем нужен этот протокол, начните с объяснения MCP простыми словами.