Figma MCP Setup: Cursor & Windsurf (Complete Guide)

This video gives you a quick, no-nonsense way to connect MCP with Figma and your code tools. It’s built to be set up once and reused forever. If your work lives in Figma and you want a better bridge between design and code, treat this as your starting reference.

*This is also part one of all our vibe-code content upcoming. Will be unique for designers. Just did not want to keep setting up MCP at the start of every future video...

🔗 KEY LINKS
📣 JOIN THE COMMUNITY: https://uicollective.co/

VIBE CODE DESIGN SYSTEM COMPONENTS: https://youtu.be/09VgyFFLrOw

❓ Why Join UI Collective Academy? Get access to premium courses, premium downloads, and so much more on the way (I am largely building this solo...trying to make design education available for all, support goes a long way!)

MY FRIEND AMIR'S CHANNEL (CURSOR EXPERT):
Channel: @amirmxt
Amir's community: https://buildshipmarket.com/

↪️ Need a design system? (also included in the academy): https://collectivekit.co/

🔗 OTHER VIDEOS
Build a Design System: https://youtu.be/opTANvl9G1g
Complex Design System Setup: https://youtu.be/L-tpK7Eeuow

🔗 MORE LINKS
@Figma MCP Catalog: https://www.figma.com/mcp-catalog/
Let us build or fix your design system: https://designsystemlabs.co/
kirkland@uicollective.co

0:00 An Introduction
0:49 Cursor Setup
4:55 Windsurf Setup