Designers have long handed off work from Figma to engineering—but Model Context Protocol (MCP) is changing that workflow. In this episode of Cozy AI Kitchen, Joanna Oikawa (Product Design Lead, VS Code) walks through how Figma MCP connects Figma designs directly to VS Code, enabling faster iteration, live collaboration, and AI‑assisted UI development.

Watch the full episode at https://aka.ms/CAIK-JoannaOikawa

Microsoft Developer

A quick walkthrough on connecting Figma to VS Code using the Figma MCP server extension. The setup involves two main steps: installing the Figma MCP Server extension from the VS Code extensions marketplace and logging in with a Figma account, then enabling developer mode in Figma to activate the MCP section. Once connected, the server runs locally and bridges design files with the VS Code workspace.

Setting Up Figma MCP Server in VS Code