Figma MCP Server + Augment Code Integration

@shedytee

Repository

Basic information

About 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 config

No standard config provided

This server doesn't expose a parseable MCP config block in its README. See the repository for install instructions.

Repository

Figma MCP Server + Augment Code Integration tools

Tool list not available yet

This listing does not currently have a tool list to display. This does not mean the server has no tools; check its documentation for supported capabilities.

We auto-extract tools from the README. The maintainer can list them under a ## Tools heading to populate this section.

Overview

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

Frequently asked questions

What dependencies or runtime are required?

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

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.

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.

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.

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.

Comments

More Media & Design MCP servers

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.

Organize with AI (OwAI)

Alexander Visheratin

Search and manage photo and video libraries through AI assistants. Find images and video moments, review duplicates, and organize collections, groups, favorites and people across local folders, Apple Photos and OneDrive.

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.

Veltake Studio

Veltake AI

Drive Veltake Studio from any AI agent: create film and ad projects, have the Studio agent build scenes on the canvas, price and start renders, export edited cuts, and make single images, video, speech and music in one c

Soundza

Free sound effects, music and ambience for games, videos and apps. Search by mood, tempo, key or use, play previews and download full-quality files, each with 35 metadata fields.