Figma adds a new Specs editor and opens code layers to more users

In short: Figma announced new tools to help teams set clear design rules for AI helpers and to build more interactive prototypes.

What happened

Figma, a popular design platform, announced several new features at its first Config event in India. The updates focus on helping teams explain their design rules in a clear way and then use those rules when working with AI.

One of the main additions is Figma Specs. It is a Markdown-based editor, meaning it uses a simple writing format that is easy to read (like writing notes with headings and bullet points). Teams can use Specs to describe their “design language,” such as which colors, fonts, and layout rules match their brand. The Specs document can live on its own in Figma or sit alongside the design canvas, and it can link to other items like diagrams, designs, and code layers.

Figma also said teams can pull more background information into a central place, including design libraries and code libraries (shared collections of reusable parts). The goal is to give both people and AI agents a single reference to follow.

Separately, Figma is making its code layers feature available in open beta, so more people can try it. Code layers let users add code to designs to create more interactive prototypes (like a mock app you can click through). Users can also ask Figma’s agent to turn a design into code or to edit part of that code.

Why it matters

AI tools can sometimes produce inconsistent results. By letting teams write down design rules in a clear, central document, Figma is trying to make AI behave more like a reliable assistant that follows a company’s style guide (like giving the AI a rulebook before it starts working).

Source: TechCrunch AI