Codex now supports connecting to Figma through MCP natively, so the experimental_use_rmcp_client flag from older tutorials is no longer needed. Figma currently offers remote and local MCP servers. Figma recommends the remote version because it has a broader feature set and does not require Figma Desktop to stay open.
Which Connection Method Should You Choose?
| Method | Address | Best for |
|---|---|---|
| Remote MCP (recommended) | https://mcp.figma.com/mcp | Everyday design inspection, asset downloads, Code Connect, and writing to Figma |
| Local MCP | http://127.0.0.1:3845/mcp | Reading the layer currently selected in Figma Desktop, or organizations restricted to local services |
Unless you have a specific constraint, use the remote MCP server.
Method 1: Install the Codex Figma Plugin
Open Plugins from the top-left corner of the Codex app, find Figma, and install it. Then sign in and grant access when prompted. This installs both the MCP configuration and commonly used Figma skills, making it the easiest option if you do not want to maintain the configuration manually.
After installation, start a new session and confirm that the Figma tools appear in the available tool list.
Method 2: Add the Remote Figma MCP from the Command Line
Run the following with the Codex CLI:
codex mcp add figma --url https://mcp.figma.com/mcp
Complete the Figma OAuth sign-in flow in your browser. Then verify the connection:
codex mcp list
You can also enter /mcp in the Codex terminal interface to check the server status or reauthenticate.
Codex stores MCP settings in ~/.codex/config.toml. The equivalent manual configuration is:
[mcp_servers.figma]
url = "https://mcp.figma.com/mcp"
Restart Codex after saving the configuration.
Method 3: Connect to the Local Figma Desktop MCP
- Install and open the latest version of Figma Desktop.
- Open a Figma Design file.
- Press
Shift + Dto enter Dev Mode. - Enable the Desktop MCP Server in the MCP Server section of the Inspect panel.
- Add the following to your Codex configuration:
[mcp_servers.figma-desktop]
url = "http://127.0.0.1:3845/mcp"
The local service works only while Figma Desktop is running and the file remains open. If the connection fails, first confirm that the MCP switch is still enabled in Figma, then restart both Figma and Codex.
Use Codex to Read a Design
The remote MCP locates a node through its link:
- Select a frame or layer in Figma.
- Copy the link to that node rather than the link to the file’s home page.
- Send the link to Codex and specify the target stack and code directory.
For example:
Read this Figma frame and implement it using the project's existing Vue components and Tailwind styles.
Prefer components from src/components, do not generate inline styles, and save images under static/uploads.
The local MCP can also read the layer currently selected in Figma Desktop, so you can ask Codex to “implement the frame selected in Figma.”
Improve Design Fidelity
- Explicitly ask Codex to reuse existing components, design variables, and Tailwind conventions.
- Provide the specific frame link instead of linking only to the whole Figma file.
- Configure Code Connect so Figma components map to real components in the codebase.
- Explain how images, icons, and fonts should be handled.
- Implement the page structure first, then refine spacing, typography, and responsive states through screenshot-based iterations.
Figma MCP provides design context, but it does not produce flawless production code with one click. The final result still depends on the design file’s structure, the component system, and the constraints in your prompt.
Common Questions
Figma Tools Do Not Appear After Configuration
- Run
codex mcp listto check the connection state. - For the remote server, repeat the OAuth sign-in.
- For the local server, confirm that Figma Desktop and the target file are still open.
- Restart Codex after changing
config.toml.
Is experimental_use_rmcp_client Still Required?
No. Codex now supports Streamable HTTP MCP servers natively, so the old experimental field should be removed from your configuration.
Can Remote and Local Servers Be Configured Together?
Yes, but give them distinct names such as figma and figma-desktop, and specify which server to use so Codex does not select the wrong one.
