“Bringing Claude Code workflows directly into Figma lets developers, designers, and even hobbyists capture a real, functioning UI from a browser — in production, staging, or localhost — and convert it into editable frames on the Figma canvas. Code is powerful for converging — running a build, clicking a path, and arriving at one state at a time. The canvas is powerful for diverging — laying out the full experience, seeing the branches, and shaping direction collectively. Going from code to canvas helps teams move fluidly, so work can narrow when it needs to and open up when it’s time to collaborate.”

My guess is it’s based on the html.to.design technology that Figma acquired last year, which is a huge time saver and an essential part of my toolkit. I haven’t tested Claude Code to Figma yet, but the result in demos looks very similar to what I usually get from the plugin. Which makes me wonder why they limited it to Claude Code instead of making something like a universal ​“Send to Figma” browser extension?

On a recent livestream, Product Designer Megan Bednarczyk and Software Engineer Nile Phillips from Figma demonstrated how PDE teams can use AI-powered diagramming to tackle complex problems and visualize the bigger picture.

With the Figma MCP app in Claude, designers, developers, and product managers can now create AI-generated FigJam diagrams.