TheVortiq
Software

Figma Config 2026: Code Layers and AI Plugins Redefine Design

The platform integrates executable code into the canvas and allows creating custom AI plugins, bridging the gap between design and development.

June 27, 2026 · 4 min read

Colorful HTML code displayed on a computer screen for programming projects.

TL;DR: Figma launches code layers (executable code on the canvas) and AI Skills (custom AI plugins) at Config 2026, eliminating the design-development gap and democratizing AI in design.

What happened?

During the Config 2026 keynote, Figma announced two major innovations: code layers and AI Skills. Code layers allow designers and developers to work with executable code directly on the collaborative canvas. Teams can clone GitHub repositories, extract flows from code into design layers for testing, collapsing the handoff step that has defined the design-development workflow for over a decade. According to The Next Web, this feature enables validating real behaviors before moving to production, accelerating iteration cycles. On the other hand, AI Skills are artificial intelligence plugins that users can build and customize, integrating models like GPT-4o, Claude 4, or Gemini 2.5 directly into Figma to automate repetitive tasks, generate design variants, or analyze components. Figma also presented improvements in animations and a new accessibility plugin, though these were not the main focus.

Why is it important?

Integrating executable code into the design canvas addresses one of the most persistent friction points in digital product development: the gap between design and development. Traditionally, designers create static mockups and developers translate them into code, a process prone to errors and misunderstandings. With code layers, code becomes part of the design, allowing validation of real behaviors before moving to production. This accelerates iteration cycles and reduces early technical debt. Additionally, AI Skills democratize access to AI, enabling any team to create custom assistants without advanced machine learning engineering. This move fits into a broader trend: the convergence of design and development tools, similar to what happened when Sketch introduced symbols and shared styles, or when Framer incorporated React components. However, Figma goes a step further by integrating executable code directly into the canvas, which could redefine the workflow for millions of users.

Consequences for the market

These moves position Figma as a comprehensive product development platform, directly competing with tools like Framer, Webflow, and, in the AI space, third-party plugins. Code layers could cannibalize part of the advanced prototyping and code inspection tool market, while AI Skills could reduce reliance on external solutions like Galileo AI or Uizard. For users, the benefit is a more unified workflow with fewer context switches. However, it also implies greater complexity and a steeper learning curve. In market terms, Figma reinforces its position as a leader in collaborative design, especially after the failed acquisition by Adobe in 2023. Competitors like Adobe XD and Sketch will need to respond with similar innovations or risk losing market share. Moreover, AI integration could accelerate the adoption of intelligent assistants in design, a segment that Gartner predicts will grow 30% annually until 2028. However, cannibalization of existing prototyping tools could create tensions in Figma's plugin ecosystem.

What readers should know

Code layers launch in private beta for Enterprise teams, with general availability expected by the end of 2026. AI Skills will be available in the Figma marketplace starting next quarter. It is important to note that executable code on the canvas raises security and performance questions: Figma must ensure that user code does not compromise the platform or expose sensitive data. The company has implemented isolated sandboxing, but full technical details have not yet been revealed. Additionally, customizing AI plugins will require users to have basic knowledge of prompting and model configuration, which could limit initial adoption. Finally, the company confirmed that AI Skills will integrate with Figma Slides and FigJam, extending AI across all its tools. According to statements by Dylan Field, CEO of Figma, during the presentation: "We are removing the barrier between design and code so that teams can create better products faster." However, some analysts warn that the added complexity could alienate less technical designers, repeating the resistance pattern seen when components were introduced in Sketch. In summary, Figma is betting on an ecosystem where design and development converge, powered by artificial intelligence. Competitors will need to respond with similar innovations or risk falling behind in a market that increasingly demands speed and collaboration. The key will be how Figma manages security, usability, and user transition to this new paradigm.

Keep reading