Представьте: вы пилите проект, дизайн лежит в Figma, и хочется, чтобы Cursor сам всё подгрузил и сверстал. Без танцев с экспортами и копипастой. Это возможно — благодаря MCP.
Что такое MCP?
MCP (Model Context Protocol) — открытый протокол, который позволяет AI-моделям (таким как в Cursor) взаимодействовать с внешними системами: Figma, Git, базы данных и т.д. Кстати, этот протокол придумали в Anthropic и анонсировали в конце 2024 (кажется, в ноябре).
MCP даёт для AI контекст: что происходит, какие есть данные, как их использовать. В случае с Figma — Cursor "видит" дизайн и может превратить его в код. На текущий момент, доступно огромное количество MCP серверов под любые хотелки и сервисы (можно поискать здесь https://mcp.so или здесь https://www.pulsemcp.com/clients)
Интеграция Figma + Cursor через MCP — по шагам:
1️⃣ Получите API-токен в Figma:
Profile → Settings → Security → Personal Access Tokens → Generate new token (записать, так как отображается целиком разово и потом уже не скопировать его повторно).
2️⃣ Пропишите MCP-сервер в Cursor:
В настройках добавьте:
{
"mcpServers": {
"Framelink Figma MCP": {
"command": "npx",
"args": ["-y", "figma-developer-mcp", "--figma-api-key=<put_figma_api_key>", "--stdio"]
}
}
}
Замените <put_figma_api_key> на ваш токен.
3️⃣ Скопируйте ссылку на нужный дизайн в Figma — например, фрейм мобильного экрана.
4️⃣ Вставьте её в Cursor и напишите, что нужно сделать:
«Сверстай дизайн указанного экрана»
Cursor сам подтянет ресурсы, картинки, стили и сгенерирует полноценную верстку прямо в проекте.
Если нужно сделать обратную связь, чтобы из Cursor можно было дизайнить в фигме, то умельцы и этот кейс закрыли с помощью “Cursor Talk to Figma MCP” (вот тут https://github.com/sonnylazuardi/cursor-talk-to-figma-mcp)
Если хочется лучше погрузиться в MCP и как оно устроено или даже написать свой MCP сервер, то вот главный портал про MCP https://modelcontextprotocol.io
Zapier на днях релизнул свой MCP, через который можно добавить интеграцию с огромным количеством сервисов. Подробнее https://zapier.com/mcp
Поэтому Cursor можно уже использовать не только для разработки. Но важно помнить: MCP-серверы получают доступ к вашим ресурсам, включая локальные файлы. Используйте только доверенные и проверенные решения. Мы ещё можем столкнуться с ситуациями, когда через MCP будут пытаться похищать персональные данные — будьте внимательны.
Если уже используете какие-то MCP, расскажите в комментариях.
ИИволюция