My first vibe coding experiment -connecting Figma → Cursor via MCP 🚀

Reposting this from an old LinkedIn post on 09/08/2025.

Tried something new last weekend 👩🏻‍💻 — connecting Figma → Cursor via MCP.
Big thanks to Romina Kavcic's tutorial and Youtube University for showing me the way! 🙌
I managed to create a mobile version page with 4 interactive features in just 2.5 hrs (after the design was done! The final look still needs a bit of adjustment, but the functionality works perfectly)

✨The page allows users to see the funeral announcement and buying flowers🌸 for their loved one who passed away.

The features are:
1️⃣ Scale text accordingly and the icon is draggable
2️⃣ Google map navigation
3️⃣ Buying flowers→ open another page to purchase( haven’t connected the page yet )
4️⃣ Make a call

👉Normally, putting these together would take 1–2 days of frontend work.
This time: 50%+ faster. 🤯

Normal flow (in my company):

Figma file → prototype in Figma
→ frontend development
→ designer double-check if functionality & visuals align with design
→ engineer refines
→ designer checks again (and the loop continues…)

What I did this time (via vibe coding flow):

Figma file → Connect Cursor via MCP → Command & adjust right inside Cursor

✨Here’s what I learned along the way (first vibe coding takeaways):

1. Connecting Figma and Cursor through MCP took some digging
(different Cursor versions work a bit differently — YouTube tutorials were helpful)
2. Breaking things into tiny tasks works better
3. Sometimes pasting Figma dev code into Cursor works better than “copy link to selection” and commands
4. Cursor has two modes: Agent vs. Ask → Ask is fine for questions, but too slow for building features
5. Knowing a bit of CSS/JS would help for quick fixes

🔮 Next vibe coding experiments on my list:

* Play with Figma components & variants so state changes sync in Cursor
* Try connecting an entire design system through MCP
* Build a small library of frequently used components and reuse via MCP
* Compare other AI coding tools like Copilot and Claude

Honestly, this first try gave me a whole new vibe for how designers, developers, and AI might collaborate.

Super curious where this workflow can go 🚀
👉 Anyone else here experimenting with vibe coding workflows bridging Figma + AI coding tools ?
What’s working (or not) for you?

Final result

Previous
Previous

🚀 Building a Backend Platform Prototype with AI - Figma Make