Build the right thing, fast.

Figma connects your design context, codebase, and agents, so you build and ship with speed.

Go from prompt to PR in one place.

Push what you create in Figma Make straight to your codebase. Prompt, edit visually, then ship to production when you’re ready.

Figma Make works however you do. Start with a prompt or visually edit.

Explore Figma Make

Code reusable components once, then scale them everywhere.

Build efficiently and consistently when you connect your design context to your codebase.

Sync components and code
Connect your design system directly to your code components.
Explore Dev Mode
Give design context to your codebase
Use the Figma MCP server to pull all design details into your repo.
Get Figma MCP docs

Shape what you ship—together.

Dev tools purpose-built to help you align on the path forward. Build with intention alongside teammates and AI agents.

Review

Turn production code into editable Figma files. Your team can view what you’ve built and make changes—then push edits back to your codebase via the MCP server.

Prompt out your proof of concept.

Plan
The FigJam MCP is your coding agent’s whiteboard. Generate architecture diagrams directly from your favorite AI coding tools.
Get FigJam MCP docs
Inspect
With a dedicated view for devs—plus collaboration features like status updates—you’ll know exactly where to focus your work.

The products you love are designed in Figma

It’s important that designers and developers have a shared language—and that’s even more critical with LLMs. Figma closes gaps in our design system, making the path from design to build seamless, scalable, and consistent.