Design to code with AI in Figma Make
Describe the experience you want to build. Figma Make turns your designs into working, editable code—ready to test, share, or refine.
Go from design to functional code with AI
Generate code with natural language
Start with a frame and describe what you want. Figma Make outputs editable, functional code—so you can move from mockup to testable prototype faster.
Edit and inspect the output
Use the built-in code editor to inspect, tweak, and extend the code that powers your design.
Design and develop in the same space
No more switching tools or rebuilding from scratch. Figma Make lets you prototype and adjust the code in one seamless workflow.
Share or publish your prototype
Share with just your teammates or launch for all users.
Built by real teams.
See how makers, designers, and PMs are using Figma Make to build no-code web apps—from internal tools to product MVPs.
- Jacques Debeuneure Jr.
- Daniela Muntyan
- kishoree04u
- Seungmee Lee
How to generate a prototype with AI in Figma Make
FAQs
From the blog
3 ways product teams are building conviction faster with Figma Make
From communicating complex behaviors to pushing the edges of an idea, product managers at ServiceNow, Ticketmaster, and Affirm are using Figma Make to prototype their way forward.
Workflow lab: AI image tooling and interactive prototyping in Figma
A workflow to try—bringing together precise image editing, Vectorize, and interactive prototypes to move from concept to crit to completion faster.
Show don't tell: Embed Make prototypes everywhere you work in Figma
Today, we’re introducing the ability to embed Figma Make prototypes into Figma Design, FigJam, and Figma Slides, along with new editing tools that help you build and share your best ideas.
Cooking with constraints: A designer’s framework for better AI prompts
Design and cooking share a truth: Preparation determines the outcome. Structured prompts turn AI from guesswork into a reliable design partner.
Prototypes are the new PRDs
A growing number of product managers are finding that the fastest way to clarity is to build. Inside Figma Make, they’re pressure-testing assumptions early, building momentum, and rallying teams around something tangible.
Figma Make is now available in Figma for Government
With Figma Make now available in Figma for Government, teams can prototype faster, collaborate securely, and accelerate progress on modernizing public services.
More resources
What is MCP?
Read articleLearn about Model Context Protocol (MCP), the open standard that simplifies AI integration like a USB-C for data.
What is Vibe coding?
Read articleVibe coding combines mood-driven design with seamless coding to create immersive digital experiences that connect emotionally and function flawlessly.
How to design an app in five steps
Read articleBuilding an app requires research and constant iteration to meet customer needs. Learn how to design an app and how Figma can help in this guide.