Last updated
March 16, 2026
MCP profile
Figma MCP Server
The Figma MCP server brings Figma design context directly into your AI workflow.
Content & MediaRemoteOpen SourceExternal
Visibility
Public
ByRegistry
About This MCP Server
> This integration leverages the MCP resources capability, which allows your agent to fetch context directly from Make projects. It is available only on clients that support MCP resources.
1. Prompt your agent to fetch context by providing a valid Make link 2. Receive a list of available files from your Make project 3. Download the files you want to fetch when prompted
Use this to get design context for your Figma selection using the MCP server. The default output is React + Tailwind, but you can customize this through your prompts:
You can paste links to the frame or component in Figma before prompting.
Learn how to set up Code Connect for better component reuse →
Captures, imports, or converts a web page into a Figma design. You can send live UI interfaces as design layers to new or existing Figma files, or to your clipboard.
Use this tool to create a rule file that gives agents the context they need to generate high-quality front end code. Rule files help align output with your design system and tech stack, improving accuracy and ensuring code is tailored to your needs.
After running the tool, save the output to the appropriate rules/ or instructions/ directory so your agent can access it during code generation.
Capabilities
Generate code from selected framesExtract design contextCode smarter with Code ConnectGenerate Figma designs from web pages (rolling out)
Tools & Endpoints
Example Workflow
1. Share your Make project link with your agent. 2. Prompt the agent: _"I want to get the popup component behavior and styles from this Make file and implement it using my popup component."_
Your agent will fetch the relevant context from Make and guide you in extending your existing popup component with the prototype's functionality and styles.
Why Use Figma MCP Server?
- Generate code from selected frames
- Extract design context
- Code smarter with Code Connect
- Generate Figma designs from web pages (rolling out)
Specifications
Status
live
Industry
Content & Media
Category
General
Server type
Remote
License
Open Source
Verified
Yes
Hosting
Hosting Options
- Remote
API
Integrate this server into your application. Choose a connection method below.
1
Configure
Configuration
json
{
"mcpServers": {
"figma": {
"url": "https://mcp.figma.com/mcp"
}
}
}Performance
Usage
Quick Reference
- Name
- Figma MCP Server
- Function
- The Figma MCP server brings Figma design context directly into your AI workflow.
- Transport
- Remote
- Source
- External (Registry)
- License
- Open Source
Get started
Ready to integrate this MCP server?
Book a demo to see how this server fits your workflow, or explore the full catalog.