Figma unveils code layers and custom AI plugins at Config 2026

▼ Summary
– Figma introduced code layers at Config 2026, allowing teams to bring executable code onto the design canvas for testing and reducing the traditional design-to-development handoff.
– The update includes native animation and motion support, AI-generated shader effects, new AI skills for the design assistant, and the ability to create custom plugins through text prompts.
– Users can build and modify code layers using AI chat or Figma’s code composer, supporting npm packages for interactive elements like dropdown menus and 3D frameworks.
– Figma is deepening integration with Figma Weave, acquired in October 2025, and will later allow users to generate Weavy workflows directly within Figma.
– The company faces competitive pressure from AI coding tools like OpenAI’s Codex, with its stock down roughly 79% since its July 2025 IPO, despite 46% revenue growth in Q1.
Figma unveiled a major set of updates at its Config 2026 conference on Wednesday, including code layers, native animation support, AI shader effects, custom AI skills, and prompt-built plugins. The announcements were made during the opening keynote at the Moscone Center in San Francisco, where in-person tickets sold out ahead of the three-day event.
The headline feature, code layers, brings executable code directly onto Figma’s collaborative design canvas. Teams can now clone repositories and extract flows from code into design layers for testing, effectively collapsing the handoff step that has defined the design-to-development workflow for over a decade. Chief product officer Yuhki Yamashita explained that this feature is meant to change how designers, product managers, and engineers collaborate on ideas. He told TechCrunch the multiplayer canvas is powerful because teams exploring new directions don’t need to worry about code quality, allowing them to iterate without the pressure of writing production-ready code.
The code layer feature works within Figma Sites and is backed by custom React code. Users can convert components to code layers, use AI chat to build and modify them, or edit directly in Figma’s code composer. The system supports npm packages, including motion libraries and 3D frameworks, enabling interactive elements like dropdown menus and shader effects without leaving the canvas.
Figma also added native support for animations, transitions, and 3D transforms. Previously, designers had to create motion work in external software and convert it into code that Figma could interpret. The update eliminates that step, letting designers build and preview animations directly inside their design files. Additionally, AI-generated shader fills and effects can now be created through text prompts.
The company is deepening its integration with Figma Weave, the product it built from its acquisition of node-based AI media tool Weavy last October. Figma launched its own AI design agent last month, and the Config updates extend that agent with new capabilities. Users can now write text prompts to create repeatable skills that the AI assistant can execute, and they can connect external tools like Notion, Granola, Excel, and GitHub to give the agent richer context. A separate update, rolling out later this year, will let users generate Weavy workflows directly within Figma, tightening the connection between the two platforms.
Figma is also adding prompt-based custom plugin creation. Users can describe what they want,such as a layout generator or a vector path tracer,and Figma will build the plugin. This feature extends the platform’s existing plugin ecosystem, which already hosts thousands of community-built tools, by lowering the barrier from writing code to writing a sentence.
The updates arrive at a complicated moment for Figma’s business. First-quarter revenue grew 46 percent year over year to $333 million, and net dollar retention hit 139 percent, the highest in more than two years. But AI coding tools like OpenAI’s Codex are expanding from developer tools into enterprise platforms that can generate interfaces from text prompts, threatening to bypass design tools entirely. Figma went public in July 2025 at a $20 billion valuation. Its stock has since fallen roughly 79 percent, trading around $24, as investors question whether traditional design software can defend its position against AI-native competitors.
The competitive pressure is broad. Canva launched its own AI foundation model in March, Adobe’s Firefly holds 41 percent business adoption, and Google unveiled Pics, an AI design tool inside Workspace, at I/O 2026. The code layers announcement is Figma’s answer to that pressure, an argument that the design canvas should absorb code rather than be replaced by it. If engineers can prototype directly on the canvas alongside designers, the tool becomes harder to route around with a text prompt to a coding agent. Yamashita framed the feature as producing “different behaviour not just with designers, but also with engineers and PMs.” Whether that behaviour materialises will depend on whether product teams actually adopt code layers as a collaboration surface or continue treating design and development as separate disciplines with a handoff in between.
(Source: The Next Web)

