广告合作
MCP.so
登录

Figma MCP Server + Augment Code Integration

@shedytee

代码仓库

基本信息

分类

媒体与设计

许可证

View license

传输方式

stdio

作者

shedytee

关于 Figma MCP Server + Augment Code Integration

Example integration of a Figma MCP server with Augment Code, using Node.js and figma-js.

Figma MCP Server + Augment Code Integration 配置

暂无标准配置

该服务器的 README 中没有可解析的 MCP 配置块，请前往代码仓库查看安装说明。

代码仓库

Figma MCP Server + Augment Code Integration 工具

工具列表暂未提供

当前收录暂时没有可展示的工具列表，不代表服务没有工具。请查阅项目文档了解支持的能力。

工具是从 README 中自动提取的。维护者可以在 ## Tools 标题下列出工具,即可填充这部分内容。

概览

What is 🚀 Figma MCP Server + Augment Code Integration?

This project builds a Model Context Protocol (MCP) server that connects to the Figma API, exposes Figma file data through an MCP‑compatible interface, and integrates as a custom tool inside Augment Code. It is designed for developers who want to query design system components, layers, and styles directly from their code editor.

How to use 🚀 Figma MCP Server + Augment Code Integration?

Clone the repository, install dependencies with npm install, and configure environment variables (FIGMA_TOKEN, FIGMA_FILE_ID, MCP_PORT) in a .env file. Run the server with npm run start:mcp, then add a new MCP server in Augment Code’s workspace settings with the command pointing to figma-mcp-server.js and the same environment variables set.

Key features of 🚀 Figma MCP Server + Augment Code Integration

  • Query Figma files via an MCP‑compatible interface
  • Integrates directly into Augment Code as a custom tool
  • Uses @modelcontextprotocol/sdk, figma-js, zod, and dotenv
  • Includes ready‑to‑use example prompts in prompts.md
  • Works with any Figma design file

Use cases of 🚀 Figma MCP Server + Augment Code Integration

  • Ask for the full data of a Figma file inside Augment Code
  • Fetch the latest version of a Figma file via the API
  • Retrieve details about a specific component (e.g., ButtonPrimary)
  • List all components in a design file

常见问题

1

What dependencies or runtime are required?

Node.js and npm are required. The server depends on `@modelcontextprotocol/sdk`, `figma-js`, `zod`, and `dotenv`.

2

Where does the Figma data live?

Data is fetched live from the Figma API using your `FIGMA_TOKEN` and `FIGMA_FILE_ID`. No data is stored locally beyond what the server caches in memory.

3

How is authentication handled?

Authentication uses the `FIGMA_TOKEN` and `FIGMA_FILE_ID` environment variables. No OAuth flow is provided; you must generate a personal access token in Figma.

4

Are there any known limits or issues?

Directory paths containing spaces (e.g., `Moments Platform`) cause syntax errors in the Augment Code command. Either wrap the path in quotes or move the project to a path without spaces.

5

What transport does the MCP server use?

The server uses standard input/output (stdio) transport, invoked via a `node` command in Augment Code’s MCP settings.

评论

媒体与设计 分类下的更多 MCP 服务器

Constants

Constants AI

One workspace of tools for Claude and ChatGPT. Connect apps, generate video, music, and ads, and build new tools on demand. Generate and publish ad creative directly from your assistant.

CoDesign

IMG.LY

Give your AI agent a real design engine. Create, edit and export real, editable designs from Claude Code, Codex, Cursor and more.

SVGator

SVGator

Drive your SVGator account from any AI assistant. Prompt an animation, get an editable project back, and export it as SVG, Lottie, GIF, MP4, and more, then open it in the editor to finish by hand.

EveryGen AI MCP Server

EveryGen AI

EveryGen AI MCP Server lets AI assistants create videos, images, voiceovers, music and complete multi-shot films. Connect your EveryGen AI account, describe what you want, review the credit quote and approve the creation

Uwear.ai

Uwear.ai

Run complete AI fashion photoshoots from ChatGPT, Claude, or Codex. Turn flat-lay, packshot, and mannequin product images into catalog-ready on-model photos and video with saved art direction, automatic QA, and catalog-s

广告合作