Over the past few weeks I’ve been getting a steady stream of the same question:
“Can you run Figma Console MCP with Codex?”
Short answer: yes!
Long answer: it works really well, and the setup is actually pretty straightforward once you know where everything lives.
I recorded a short demo walking through the entire process from start to finish so people experimenting with Codex can get up and running quickly.
Why Codex?
Most of the examples people have seen so far use tools like Cursor or Claude Desktop. Those environments typically rely on editing JSON configuration files to register MCP servers.
Codex approaches this a little differently.
Instead of editing config files manually, Codex provides a graphical interface where you can register MCP servers directly from the settings panel. Once the server is registered, the workflow behaves just like any other MCP-enabled environment.
The underlying interaction model stays the same.
The AI can read structured information from Figma.
It can write back to Figma.
And it can compare that design data against code in your repository.
What the Demo Covers
In the demo I walk through the full setup process:
Downloading the Figma Console MCP repository
Creating a Figma personal access token
Registering the MCP server inside Codex
Connecting the Figma Desktop Bridge plugin
Verifying the connection with a status check
Once everything is connected, the fun part begins.
The AI can start interacting directly with your design system.
For example:
Asking which component set is currently selected in Figma
Navigating between local Figma projects
Listing the variables and tokens used by a component
Writing comments directly back into the Figma file
Pulling component metadata from the design system
And because the AI is also running inside your codebase, it can compare what exists in design with what exists in code.
In the demo I run a design-to-code parity check on a card component. The system reads the component specification from Figma, inspects the corresponding TypeScript component in the repository, and generates a parity score between the two implementations.
From there you could:
• generate a GitHub issue
• create a patch for the component
• or continue auditing other components in the system
The Bi-Directional Workflow
The interesting part here isn’t just reading data from Figma.
It’s the bi-directional nature of the workflow.
The AI can:
inspect design system metadata
analyze token usage
evaluate code parity
suggest updates
and write information back into the design file
Design and code stop being two separate silos.
They become two sources of structured context that the AI can reason over simultaneously.
Codex Setup Is Now in the Docs
Since Codex handles MCP registration a little differently, I’ve added Codex-specific setup instructions to the Figma Console MCP documentation.
If you’re experimenting with Codex and want to connect it to Figma, that guide should get you running in a couple minutes.
Final Thought
What continues to surprise me about this stack is how quickly the feedback loop collapses.
Instead of manually inspecting design files, digging through component libraries, and writing tickets, you can ask the AI to evaluate the relationship between design and code directly.
It’s still early days, but workflows like this start to make design systems feel a lot more alive.
If you’ve been experimenting with Codex, MCPs, or similar tooling, I’d love to hear what you’re building.
