How Figma Turns Designs into Working Apps in Minutes with Claude

Figma is the platform where product teams design and build digital products—from early concepts to shipped software. As AI advanced, Figma recognized that the role of design was rapidly evolving, and saw an opportunity to help designers expand their creative impact by enabling them to bring their designs to life while inviting more people into the design process.

The core problem was the friction between design and development. "The traditional handoff between design and development creates friction. There's back-and-forth where the developer returns saying 'here's what I built,' and it doesn't match the original vision," said Alex Mullans, a product manager at Figma. Prototyping any idea required either design skills or coding ability—or both—and most people who had something to contribute had neither on demand.

Figma evaluated multiple AI models for the capability to generate high-quality code while understanding design intent and aesthetics. "Before Anthropic came around, you saw these AI models were intelligent, but they definitely lacked taste, they lacked character. You would ask them to generate a design and the design would come out rather flat," said a Figma Make engineer. "And then Anthropic came around and now we have both intelligent models and models with taste." Claude Sonnet was the team's breakthrough moment—the point when code generation became reliable enough to enable their vision. The team integrated Claude into two products: Figma Sites, which lets designers add interactivity to existing website designs via natural language prompts, and Figma Make, which generates fully functional prototypes or apps from descriptions or existing Figma designs. Users can describe what they want, copy pixel-perfect mockups from Figma Design, and Claude transforms them into working software with complex logic, animations, and responsive behaviors.

The impact was immediate and personal. Holly Li, a product manager at Figma, spent 30 hours teaching herself React to build her own website—then refactored and improved all that code with Claude in a single day. She prototyped a new product flow in Figma Make in five minutes—work that would have been "literally impossible for me to do alone as a product manager without design and engineering support." One designer used Figma Make to prototype a startup idea over a weekend and impressed a VC with a fully functional demo. Another revived a long-shelved concept: making it interactive finally got the company talking about it again.

Figma stays on the cutting edge, continuously testing each new Claude release. Dylan Field, Figma CEO, described the improvement with Sonnet 4.5: "We're very impressed so far with how much it can plan ahead, and also how much it can reason about complex codebases... We had no idea how much better this round trip would get with Sonnet 4.5. It's been a very happy surprise." Figma also added an experimental models setting giving users access to the latest Claude releases—including Opus 4.6—as soon as they're available. "Claude Opus 4.6 generates complex, interactive apps and prototypes in Figma Make with an impressive creative range," said Loredana Crisan, Chief Design Officer. "The model translates detailed designs and multi-layered tasks into code on the first try." As Field put it: "As AI models get better, Figma gets better."