Figma Aims to Bridge Design and Development with Launch of New ‘Dev Mode’

Figma Aims to Bridge Design and Development with Launch of New ‘Dev Mode’

Published: June 22, 2023

Figma, the popular collaborative interface design tool, has introduced a new “Dev Mode,” which they say is their first step in bridging design and development.

Introduced during the company’s Config Conference in California, Dev Mode is a new workspace in Figma that enables product designers, web designers, and developers to work in the same file, but in different modes to streamline the creative process and make it easier to move from design to development.

Noting that developers have unique workflows and preferences, Kris Rasmussen, Figma’s chief technology officer, said that they understand that teams want to work with as little friction as possible.

“With Dev Mode, we see a huge opportunity to get developers what they need quickly and efficiently—just as we did with designers when we first set out to build Figma,” Rasmussen wrote in a blog post.

“The easier it is for teams to design, document, find, and implement high-fidelity designs without losing sight of the work and each other along the way, the better the product outcomes. We’re excited to take this first step in bridging design and development in Figma, and we can't wait to see what teams do next,” he added.

According to the company, Dev Mode is also like a browser inspector for users’ design files and can bring design concepts (such as shapes, layers, and groups) closer to developer concepts like code, icons, and tokens.

Developers will also be able to customize code to whatever language they’re working in and will enjoy a CSS box model, a modern syntax with a tree view, and the ability to toggle between dimension units to match their codebase.

“Dev Mode aims to make you more productive by connecting the tools you use and your code components to the design file,” Rasmussen said.

In addition to Dev Mode, Figma has also beefed up its platform with the addition of design variables to help teams create and manage multiple brands, devices, and themes; as well as advanced prototyping to help users create more realistic prototypes with fewer frames.

Dev Mode is now available in beta for free for the rest of 2023. However, starting in 2024, users will have the option to purchase Dev Mode access for $25 per seat per month on Organization or at $35 per seat per month on Enterprise.

Our design experts recognize the most innovative and creative designs from across the globe. Visit Design Awards to see the:

Our team also ranks agencies worldwide to help you find a qualified agency partner. Visit our Agency Directory for the top web design companies, as well as:

Get a chance to become the next Design Award winner.
Subscribe to Spotlight Newsletter
Subscribe to our newsletter to get the latest industry news