Skip to main content

Does anyone have a step by step guide on how to setup the MCP and then use code connect, like cursor and VS code? or something. Idiot proof that a junior designer can setup by themselves. Apparently the guide on figma: 



like first of all it’s not step by step. the screens doesn’t add up. checking settings and all. it’s just so ever confusing. @figma please step up and make it ever crystal clear please. i’m not a coder and your steps aren’t clear. 

Hi ​@Sham Bakri ,

 

We appreciate you taking the time to check out our YouTube tutorial How to set up the Dev Mode MCP server. I’ll pass your feedback along to the team.
 

In addition to the video, we also recommend checking out this Help Center article: Guide to the Dev Mode MCP Server

If you've already enabled the Dev Mode MCP server and you're looking for client-specific setup steps for Cursor or VS Code, take a look at the Step 2: Set up your MCP client section in that guide. There, you’ll find tabs with detailed instructions for each supported environment.

 

For Code Connect, we have a quick start guide here: Getting started with Code Connect. You can find it in the Figma Developers site.

 

If you run into issues during setup, feel free to reach out to our support team by submitting a request here: Submit a request
Please include any screenshots of what you’ve tried and any error messages, so we can better assist you.

 

Thanks,