Figma announced a suite of new features at its Config 2026 conference, significantly expanding its platform to integrate code, animation, and AI-generated design materials directly onto its collaborative canvas. Key announcements include Code Layers, built-in motion tools, shader fills and effects, and enhanced generative plugins, all aimed at pushing beyond traditional design limitations and allowing for limitless expression.
The most structurally significant new feature is Code Layers, which allows designers to treat code like any other design material. Users can now convert any design layer into an interactive code layer with a single click or prompt, work with GitHub-linked repositories, and sync changes between design and production code directly within Figma. This initiative seeks to bridge the long-standing gap between design and development by enabling designers to visually edit production codebases and generate pull requests for engineers.
Figma Motion, available now, introduces a timeline with keyframes and presets, enabling designers to build motion from scratch or layer it onto existing designs. It also supports export in formats like CSS, JSON, React, MP4, WebM, Animated SVG, and GIF. The platform also introduced shader fills and effects, allowing for the creation of advanced visual treatments and 3D effects. These new tools are designed to move design closer to a production-ready state, minimizing the need for separate software for animation or GPU shader environments.
Furthermore, AI capabilities have been significantly bolstered. Figma is introducing generative plugins and "Skills" that automate repetitive tasks, allow users to build custom tools, and share AI capabilities across teams. Connectors will enable the Figma agent to interact with tools like Notion, Slack, Granola, Hex, GitHub, and Atlassian. These updates, along with the integration of AI-powered prototyping tools like Figma Make, aim to make AI a core component of the design and development workflow, allowing designers to focus on creativity by offloading mundane tasks to AI agents.
Figma CEO Dylan Field stated the conference's central message: "AI has lowered the floor, but it has not raised the ceiling. Designers, creatives, builders — you will raise the ceiling." This strategy positions Figma in direct competition with AI coding environments like Cursor and Replit by moving the design canvas deeper into the codebase, while also moving into motion design territory previously dominated by tools like After Effects. Early access for Code Layers is expected to begin in July.
