At Config 2026, Figma unveiled a suite of design-to-code and AI features, including code layers, native animation and motion support, AI-generated shader effects, new AI skills for its design assistant, and prompt-built custom plugins, reporting by The Next Web and The Verge. The Next Web reports code layers let teams clone repositories onto the collaborative canvas, convert components into editable code-backed layers, and use AI chat or a built-in code composer to modify code; the system supports React-based code and npm packages including motion libraries and 3D frameworks. The updates were shown at Config 2026 in San Francisco, where The Next Web reports in-person tickets had sold out for the three-day event. The Next Web also reports deeper integration with Figma Weave, the product tied to last October's acquisition of Weavy.
What happened
Figma announced a package of product updates at Config 2026, showcased in San Francisco, that bring executable code and expanded AI features onto the design canvas, reporting by The Next Web and The Verge. Core introductions include code layers, native motion and animation support, AI-generated shader fills and effects, new AI skills for Figma's design assistant, and the ability to build custom plugins by writing text prompts, according to The Verge and The Next Web. The Next Web reports in-person tickets for the three-day event sold out.
Technical details
Per The Next Web, the code layers feature allows teams to clone repositories directly onto the Figma canvas, convert components into code-backed layers, and extract interactive flows into editable design elements. The Next Web reports code layers run on custom React code, are available within Figma Sites, and support npm packages including motion libraries and 3D frameworks. The Verge describes AI motion graphics and a chatbot-driven interface for turning text prompts into animations and shader effects. The Next Web reports users can edit code with an integrated code composer or via AI chat.
Industry context
Editorial analysis: Companies integrating runnable code into collaborative design tools reflect a broader pattern where design and engineering workflows converge to shorten handoff cycles. Observers following the sector note that embedding code and package support in the design layer reduces friction for prototype-to-interactive testing, while AI-driven motion and shader tooling follows an industry trend of using generative interfaces to automate repetitive creative tasks.
Implications for practitioners
Editorial analysis: For product designers, front-end engineers, and developer-experience teams, the combination of code-aware design artifacts and promptable AI skills suggests new opportunities for iterative prototyping, faster validation of interactions, and tighter sync between visual assets and runnable UI code. Industry reports indicate the underlying support for npm packages and React could make these capabilities immediately useful for teams that already depend on component libraries and JavaScript ecosystems.
What to watch
Editorial analysis: Observers will look for documentation and versioning behavior around code layers, how sync and merge conflicts between canvas edits and source repositories are handled, and how plugin creation via prompts maps to platform security and extension governance. Public reporting shows deeper ties to Figma Weave following Figma's acquisition of Weavy last October; observers will watch how media and agent capabilities from that product surface in design workflows.
Scoring Rationale #
This is a notable product release that materially affects design-to-development workflows and creative automation. It matters to designers and front-end engineers but is not a frontier research or platform-defining release.
Practice interview problems based on real data
1,500+ SQL & Python problems across 15 industry datasets — the exact type of data you work with.