Optimizing MCP Workflow for Figma, Relume, Webflow, and Claude Code Integration in Web Design

·Aug 03, 2026 11:57 PM(edited)·

I’m a designer working from finished Figma designs, using Relume, Webflow and Claude Code with the Figma, Relume and Webflow MCPs. My usual workflow is to start with the Relume Webflow starter, customise the Style Guide, then build all approved modules on one page before assembling the final site. I’m trying to work out the fastest reliable MCP workflow:

1.
Can Claude read my Figma variables/styles and accurately update the Relume Webflow Style Guide?
2.
Should Claude choose the closest Relume components, or should I identify them first?
3.
Is it best to import the native Relume Webflow component, then have Claude customise it through the Webflow MCP?
4.
Has anyone used this workflow successfully on a real production site?

Big thanks!

➕3

2 comments

· Sorted by Oldest

Matt J.
·
·
Sean R. Claude and the Figma MCP/Webflow MCP do a great job of referencing variables - easy for it to match between the two environments. I have not got to a point where I would be using the Webflow MCP to recreate sections but I have seen videos of this being done - biggest risk is trusting that it did it right - so reviewing every div, every setting, across the breakpoints etc. I gave this post a few days to simmer to see if anyone had any ideas but honestly most of these questions could be answered most effectively by trying them out. Personally, I don't have enough real-world/client experience with the process you are trying to do to give you a direction with high confidence. It's something I hope to explore very soon. I'll use your 4 questions as an outline for a test case and refer back here with my findings, would be cool if you also find anything useful and wanted to share it! 💪
❤️1
Sean R.
·
·
Matt J. I'm going to be trialling it over the next couple of weeks.
🙌1