Development featuresDevelopers, meet Dev Mode
Dev Mode is a new space in Figma for developers with features that help you translate designs into code, faster.
Now available in open beta.

Get to coding faster in Dev Mode
Dev Mode makes it easy to find the details you need to start building. Jump in and get specs—no design knowledge necessary.
Inspect designs
Dev Mode is like a browser inspector for your design file—simply hover and click objects to get details like measurements, specs, and styles—all within a safe space that won’t impact the design file.
Copy relevant code
Generate production-ready CSS, iOS, or Android code snippets from your design—or use a plugin to customize code for whatever framework you’re using.
Keep work aligned and connected
Streamline your workflow and stop jumping between your design libraries, codebase, and project management tools when you bring everything together in Figma.

Integrate your tech stack
Build your own plugins with our API, or integrate Figma with common ones—like Jira, GitHub, and Storybook.

Build consistency across design and code
Use the same language across design files and code with tokens in Figma—and view other developer resources right in your design file.

Figma for Visual Studio Code
Our extension for VS Code brings the design file into the text editor. Inspect Figma files, collaborate with designers, receive notifications, and get code suggestions to build faster.
Add structure to handoff
Seamlessly transition from design to development with new ways to organize files and stay up to date on changes.

Know when designs are ready
Use section statuses to see clearly labeled screens from designers so you always know exactly what to work on.

Compare changes to see the latest
Reduce back-and-forth with your designers by comparing a frame to its previous version to see exactly what changed.
More developer tools for productivity

Export assets
Download icons and assets from the design file with a single click.

Component playground
Test out component properties without leaving the file or making changes to the design.
Teams using Figma increase development efficiency by 35%
Explore more developer resources

Why we built Dev Mode
Explore the story behind Dev Mode and how we're making workflows more efficient in Figma.

Community plugins
Explore plugins built by the community to expand the ways you work in Figma.

Best practice guides
Learn how to make the most of Figma's features with these deep dives.