Figma adds code layers, support for animations, more AI features in new update

The Designer-Developer Bridge Gets an AI Overhaul

Figma’s latest update marks a significant shift in how design tools are evolving to accommodate the blurred lines between design and development. The introduction of code layers, motion and shader support, and AI-powered custom plug-ins signals that Figma is moving beyond static prototyping toward a more executable design environment. For an industry already grappling with the rise of AI-assisted coding tools, this update reinforces a critical trend: the design tool is becoming a development platform.

What Actually Changed

The headline features—code layers, animation support, and AI plug-ins—are not merely incremental. Code layers allow designers to embed actual code snippets directly into design files, bridging the gap between visual mockups and production-ready components. This is a direct response to the growing demand for “design-to-code” workflows, where handoffs between designers and developers are often fraught with friction. Meanwhile, support for motion and shaders enables richer, more interactive prototypes without requiring separate animation tools. The AI features, however, are the most strategically significant: Figma now allows users to create custom plug-ins using AI, effectively democratizing plugin development. Instead of waiting for Figma’s internal team or third-party developers to build a specific feature, any user can describe what they need and have an AI generate the plugin logic.

Why This Matters

Figma is positioning itself as the operating system for product development, not just a design tool. By embedding code layers, it acknowledges that the future of design is not pixel-perfect static screens but interactive, data-driven interfaces that must be built with real constraints. For AI practitioners, this is a dual-edged development. On one hand, the AI plug-in system lowers the barrier to entry for automating repetitive design tasks—think auto-generating design tokens, resizing components, or even running accessibility checks. On the other hand, it raises questions about governance: who owns the AI-generated plugin code? How does Figma ensure that these plugins don’t introduce security vulnerabilities or bias into design systems?

Implications for AI Practitioners

For those working in AI-assisted product development, Figma’s update reinforces a few key principles. First, context-aware AI is the next frontier. The ability to create plugins that understand the design file’s structure, component hierarchy, and styling conventions is far more valuable than generic AI assistants. Second, the design-to-code pipeline is becoming a real-time feedback loop. With code layers, designers can test how their designs behave in a browser-like environment, reducing the need for separate developer handoffs. Third, customizability is the killer feature. Rather than offering a fixed set of AI tools, Figma is betting that users will build their own—which means the platform’s value grows as the community contributes more plugins.

However, there is a cautionary note. The AI plugin system, while powerful, could lead to fragmentation if not carefully managed. If every team builds its own bespoke automation, design systems may become less standardized, not more. AI practitioners should focus on building plugins that reinforce design system consistency rather than bypassing it.

Key Takeaways

• Figma’s code layers and motion support signal a shift from static design to executable prototyping, reducing friction in designer-developer handoffs.
• AI-powered custom plug-ins democratize automation but require careful governance to avoid security and consistency issues.
• For AI practitioners, the opportunity lies in building context-aware plugins that understand design system constraints, not just generic automation.
• The update positions Figma as a platform for product development, not just design, challenging tools like Framer and Webflow in the process.