Talk To Figma via Claude MCP

MCP сервер, который позволяет Claude Desktop управлять Figma через WebSocket соединение, обеспечивая создание дизайна, модификацию и совместную работу в реальном времени с помощью команд на естественном языке.

Установка

Из исходников

git clone https://github.com/gaganmanku96/talk-with-figma-claude.git
cd talk-with-figma-claude
npm install
chmod +x run-figma-claude.sh

Конфигурация

Claude Desktop

{
  "mcpServers": {
    "TalkToFigma": {
      "command": "node",
      "args": [
        "~/talk_to_figma_claude/src/mcp-server/mcp-server.js"
      ],
      "env": {}
    }
  }
}

Доступные инструменты

Инструмент	Описание
`join_channel`	Устанавливает соединение с Figma
`get_document_info`	Получает информацию о текущем документе Figma
`get_selection`	Получает текущие выбранные элементы в Figma
`create_rectangle`	Создает прямоугольную фигуру в Figma
`create_frame`	Создает фрейм в Figma
`create_text`	Создает текстовые элементы в Figma
`set_fill_color`	Устанавливает цвет заливки элементов
`set_corner_radius`	Устанавливает радиус скругления углов элементов
`create_component`	Создает компоненты в Figma
`update_instance_properties`	Обновляет свойства экземпляров компонентов
`enhanced_create_component_instance`	Улучшенное создание экземпляров компонентов с расширенными возможностями
`enhanced_set_fill_color`	Улучшенная обработка цветов для операций заливки
`create_multiple_instances`	Пакетное создание нескольких экземпляров компонентов
`health_check`	Проверяет статус работоспособности соединения
`connection_status`	Проверяет текущий статус соединения

Возможности

WebSocket коммуникация с настольным приложением Figma
Создание и модификация дизайна в реальном времени через естественный язык
Создание компонентов и управление экземплярами
Улучшенная обработка цветов и инструменты стилизации
Пакетные операции для нескольких элементов
Мониторинг соединения и проверки работоспособности
Логирование с файлами по времени для отладки
Панель мониторинга сервера на localhost:3650

Примеры использования

Сначала используйте join_channel для установления соединения

Создавайте прямоугольники, фреймы и текстовые элементы

Устанавливайте цвета заливки и радиус скругления углов для элементов

Создавайте компоненты и управляйте экземплярами

Проверяйте статус соединения и выполняйте проверки работоспособности

Ресурсы

GitHub Repository

Примечания

Требует Node.js 14+ и настольное приложение Figma. Использует скрипты быстрого запуска для Linux/macOS (./bin/claude-figma-connect.sh) и Windows (bin\claude-figma-connect.bat). Плагин Figma должен быть импортирован из файла manifest.json. Расширяет оригинальный проект cursor-talk-to-figma-mcp.

Installation

Description