glips/figma-context-mcp

Framelink MCP для Figma Дайте своему программирующему агенту доступ к вашим данным Figma. Реализуйте дизайны в любом фреймворке в одноразовой версии.

Дайте Cursor и другим инструментам программирования на базе искусственного интеллекта доступ к вашим файлам Figma с помощью этого сервера Model Context Protocol.

Когда у Cursor есть доступ к данным дизайна Figma, он намного лучше точно уничтожает дизайны с одного удара, чем альтернативные методы, такие как вставка скриншотов.

Смотрите инструкции по быстрому старту →

Демо

Посмотрите демонстрацию создания интерфейса в Cursor с данными дизайна Figma

Как это работает

1. Откройте чат вашего IDE (например, режим агента в Cursor).
2. Вставьте ссылку на файл, фрейм или группу Figma.
3. Попросите Cursor сделать что-то с файлом Figma — например, реализовать дизайн.
4. Курсор забирает соответствующие метаданные из Figma и использует их для написания вашего кода.

Этот MCP-сервер специально разработан для работы с Cursor. Перед тем, как ответить контекстом из API Figma, он упрощает и переводит ответ так, чтобы модель предоставляла только наиболее релевантную информацию о макете и стиле.

Уменьшение количества контекста, предоставляемого модели, помогает сделать ИИ более точным, а ответы — более актуальными.

Начало

Give Cursor and other AI-powered coding tools access to your Figma files with this Model Context Protocol server.

When Cursor has access to Figma design data, it’s way better at one-shotting designs accurately than alternative approaches like pasting screenshots.

See quickstart instructions →

Demo

Watch a demo of building a UI in Cursor with Figma design data

How it works

1. Open your IDE’s chat (e.g. agent mode in Cursor).
2. Paste a link to a Figma file, frame, or group.
3. Ask Cursor to do something with the Figma file—e.g. implement the design.
4. Cursor will fetch the relevant metadata from Figma and use it to write your code.

This MCP server is specifically designed for use with Cursor. Before responding with context from the Figma API, it simplifies and translates the response so only the most relevant layout and styling information is provided to the model.

Reducing the amount of context provided to the model helps make the AI more accurate and the responses more relevant.

Getting Started

Many code editors and other AI clients use a configuration file to manage MCP servers.

The figma-developer-mcp server can be configured by adding the following to your configuration file.