Codex Now Connects to Figma for Bidirectional Code-Design Workflows

OpenAI

Feb 26, 2026 · Updated Apr 25, 2026

Codex now connects to Figma via the Figma MCP server, enabling a bidirectional code-design-code workflow. Figma designs translate directly to code, and live UI pushes back to Figma as editable frames for designer annotation and collaboration.

Codex, OpenAI's agentic coding desktop app, now integrates with Figma through the Figma MCP server — supporting movement in both directions. Going design-to-code: copy a Figma frame link, pass it to Codex with a prompt, and the get_design_context tool extracts layouts, styles, and components for code generation. Going code-to-canvas: ask Codex to send your running app to Figma, which captures live UI screenshots and turns them into fully editable frames.

This closes the loop that's been missing in most dev/design workflows. Designers can take the working UI into Figma, add design system components, adjust interactions, and annotate — then the changes come back to Codex for implementation. No manual recreating screens from browser, no disconnected handoffs.

Install the Figma MCP server directly in the Codex desktop app to get started.

View the full update on developers.openai.com

OpenAI Developers

@OpenAIDevsFeb 26

Code → design → code Generate design files from code, collaborate in @Figma, and implement updates all within Codex without breaking your flow. https://t.co/OXdfoy5mXS

157

View on X

Every HeadsUpAI update is written based on its original source and reviewed before it's published. Read our editorial standards →

See all AI news & updates from OpenAI →

Keep reading

GitHub Copilot Now Connects to Figma via Bidirectional MCP Server

GitHub Copilot now connects to the Figma MCP server for a bidirectional design-to-code workflow in VS Code. Developers can pull design context into code and push rendered UI back as editable frames. Any GitHub Copilot subscriber can use this today.

ClaudeFeb 18

Claude Code Now Pushes UI Screens Directly to Figma via MCP

Claude Code can now push your UI code into Figma as design frames - prompt it to visualize your screens and each one lands on the Figma canvas. The updated Figma MCP adds this code-to-Figma path, completing a bidirectional workflow.

WarpMar 15

Warp Adds Code-to-Canvas Skills for Figma MCP Integration

Warp added two built-in skills — generate-figma-content and pull-figma-content — for Figma's remote MCP server. Developers can render UI in code, push it to the Figma canvas, collect design feedback, and pull changes back without leaving Warp.

OpenAIApr 30

OpenAI Updates Codex to Visualize System Architectures Directly in FigJam

OpenAI expanded its Codex agentic coding platform to autonomously generate architecture diagrams and implementation plans within FigJam. This shift moves AI assistance from pure code generation to the visual planning phase of the software development lifecycle.