Figma brings code, AI specs and a real backend into one design workflow

Figma unveiled a major update at Config India on October 15, bringing executable code, shared specifications and a real application backend into its design workflow. The launch combines Code Layers, Figma Specs and an integration with Payload, moving the product closer to a place where teams can design, build and maintain software together.

Working code arrives on the canvas

Code Layers let teams place live, interactive prototypes alongside their designs. Users can generate one from an existing Figma frame, start from a prompt, connect a GitHub repository or capture a website through Figma’s Chrome extension. A code-backed prototype can then be explored and refined on the same canvas as the original visual work.

Figma has moved Code Layers into an open beta that is rolling out across its plans. The company says creating and editing within Code Layers will be free on paid plans through November 4, 2026; the beta uses AI credits outside that promotional allowance.

Specs gives AI agents the context behind the design

Figma Specs brings Markdown documents into the design canvas. A team can place product requirements next to frames, diagrams and code, or import an existing .md file as a starting point. Specs can evolve through collaboration rather than remaining a static handoff document.

The connection to AI agents is central: teams can share a spec through Figma’s Model Context Protocol (MCP) server so coding agents receive not just a screenshot, but the decisions, references and technical details that explain what should be built. Specs is rolling out in open beta on eligible paid plans.

Payload adds an actual backend to Figma Make

The most consequential addition may be Payload, the open-source CMS and application framework that joined Figma in 2025. With the integration, Figma Make can scaffold a database, file storage, authentication, APIs and an admin panel. That allows teams to build experiences with editable content and stored user submissions, rather than prototypes that only look functional.

For example, a team creating an event website could generate the site, manage event information in a CMS and collect registrations without separately wiring together a third-party backend. Developers can still work with Payload’s code and self-host the resulting application where Node.js is supported.

Availability and limits

Payload is being rolled out in Figma Make across plans. Hosting for Payload-backed projects is currently in beta and free, with paid pricing to be announced before the beta offering changes. Setting up Payload uses additional AI credits because the agent must generate and maintain more application code.

These releases do not remove the need for engineering review, testing, security checks or deployment planning. They make the path from prototype to functioning application shorter, but a working demo is not automatically a production-ready system.

Why it matters

Figma is moving beyond the traditional design-to-development handoff. Specs carries intent, Code Layers carries working interactions, and Payload carries real content and data. For product teams using coding agents, keeping those pieces connected could reduce context loss and make it easier to move from an idea to software that people can actually use.

Figma detailed the announcements in its Config India overview and its Payload product post .

Source: Figma