At Config 2026, Figma introduced code layers on the canvas and enabled users to create custom AI plugins.

      TL;DRFigma unveiled code layers, native animations, AI shader effects, custom AI skills, and prompt-built plugins during its Config 2026 conference.

      At the opening keynote of its Config 2026 conference on Wednesday, Figma introduced code layers, a feature that integrates executable code directly into the collaborative design canvas. Teams can now clone repositories and extract workflow elements from code into design layers for testing, effectively reducing a handoff step that has characterized the design-to-development process for over a decade.

      Along with the announcement, Figma introduced native animation and motion support, AI-generated shader effects, new skills for Figma’s design assistant, and the capability to create custom plugins through text prompts. These updates were revealed at the Moscone Center in San Francisco, where in-person tickets had sold out prior to the three-day event.

      Chief product officer Yuhki Yamashita stated that code layers aim to transform collaboration among designers, product managers, and engineers. He told TechCrunch that the multiplayer canvas is effective because teams exploring new concepts are not burdened by concerns over code quality. This spatial format allows them to iterate without the obligation of producing production-ready code.

      The code layer feature functions within Figma Sites and is supported by custom React code. Users can convert components into code layers, utilize AI chat to create and modify them, or edit directly in Figma’s code composer. The system accommodates npm packages, including motion libraries and 3D frameworks, allowing interactive elements—from dropdown menus to shader effects—without leaving the canvas.

      Figma also introduced native support for animations, transitions, and 3D transforms. Previously, designers had to use external software to create motion and translate it into code that Figma could read. The new update eliminates that step, allowing designers to construct and preview animations directly within their design files, in addition to incorporating AI-generated shader fills and effects from prompts.

      Moreover, the company is enhancing its integration with Figma Weave, the product it developed after acquiring the node-based AI media tool Weavy last October. Figma introduced its AI design agent last month, and the updates from Config further augment that agent with new functionalities. Users can now input text prompts to generate repeatable skills for the AI assistant, and connect external tools like Notion, Granola, Excel, and GitHub to provide richer context.

      A forthcoming update, set to launch later this year, will enable users to create Weavy workflows directly within Figma, establishing a closer link between the two platforms. The Weavy acquisition, which introduced a node-based canvas for merging numerous AI models with professional editing tools, has so far functioned independently at its own URL.

      Figma is also introducing prompt-based custom plugin development. Users can describe desired features, like a layout generator or vector path tracer, and Figma will generate the plugin. This addition broadens the platform’s existing plugin ecosystem, which already comprises thousands of community-created tools, by simplifying the process from coding to crafting a verbal request.

      These updates arrive at a complex time for Figma’s business. In the first quarter, the company's revenue surged by 46 percent year over year to $333 million, with a net dollar retention rate reaching 139 percent, the highest in over two years. However, AI coding tools, such as OpenAI’s Codex, are expanding from developer utility into enterprise solutions capable of generating interfaces from text prompts, posing a challenge to traditional design tools.

      Figma went public in July 2025 with a valuation of $20 billion. Since then, its stock has plummeted approximately 79 percent, trading around $24, as investors question whether traditional design software can maintain its relevance against AI-native competitors.

      The competitive landscape is extensive; Canva launched its AI foundation model in March, Adobe’s Firefly has a 41 percent business adoption rate, and Google introduced Pics, an AI design tool within Workspace, at I/O 2026.

      The announcement of code layers represents Figma’s response to these competitive pressures, arguing that the design canvas should incorporate code instead of being replaced by it. By allowing engineers to prototype directly on the canvas alongside designers, the tool becomes more difficult to circumvent using a text prompt directed at a coding agent.

      Yamashita framed the feature as fostering “different behavior not just among designers, but also with engineers and PMs.” Whether this change occurs will depend on whether product teams embrace code layers as a collaborative surface or continue to view design and development as distinct disciplines separated by a handoff process.