Figma Weave AI Creation Platform

5 posts · May 2026 – Oct 2026

What this trail covers

Figma Weave continues to integrate generative AI and professional editing tools into the open canvas, enhancing image, video, animation, motion design, and VFX media generation and editing capabilities. This evolution includes bringing Weave tools directly to the Figma Design canvas as pre-built workflows, enabling users to leverage capabilities like style transfers, product shoots, and material extraction with simplified UIs. The platform also allows users to publish their own custom workflows, and now extends design system elements into marketing campaigns through AI-driven transformations and multi-language localization.

All Figma trails

Oct 2026Workflow lab: From design system to campaign in Figma WeaveThis post details the creation of a repeatable workflow in Figma Weave that transforms elements from a design system into on-brand marketing assets. It introduces the use of Figma nodes to bring design system frames (type, color, layout) onto the Weave canvas. The workflow leverages Image Describer nodes to analyze visual references and color palettes, providing structured guidance for AI generation. A Gen Effect node is used to apply consistent visual styles (color grading, blur) across campaign assets. The Any LLM node is employed for culturally relevant localization of text across multiple languages, with final compositions and text edits handled in Figma Design.
Sep 2026Try these 5 Weave tools—and share your ownThis post details the integration of user-created Weave tools directly into the Figma Design canvas, allowing for repeatable image generation tasks. It highlights specific examples of tools built by Figma employees, such as 'Interior Design Moodboard to Render,' 'Physical Architectural Model Maker,' 'Image Reframer,' and 'Sketch Generator,' showcasing how these tools leverage LLMs for prompt writing and workflow structuring. The post emphasizes the ability for anyone building in Weave to publish tools to the Figma Community, making them directly usable on the Figma Design canvas.
Sep 2026How Coinbase used Code Connect to guide agents and shrink token costsThis post details the integration of Code Connect within Figma's MCP server to improve agentic workflows for design-to-code generation. It quantifies the impact of Code Connect on token usage (11.5% reduction), task completion time (22.3% reduction), and overall cost (22.5% reduction) by providing agents with better context of production components. The post also describes an agentic workflow using Claude Code and the `figma-code-connect` skill to rapidly migrate hundreds of design system components to the newer Code Connect format, achieving full coverage in four hours. It highlights the distinct roles of agent skills (shaping implementation) and Code Connect (providing context) in achieving high-quality, cost-effective code generation.
Sep 2026Behind the build: Generative plugins and shaders at FigmaThis post details the technical implementation and evolution of generative plugins and shaders within Figma's AI creation platform. It covers the transition from WebGL 2 to a WebGPU pipeline system for shaders, enabling them to function as miniature programs with enhanced capabilities like 3D rendering and compute shaders. The introduction of PropsKit, a web components-based Figma UI kit, is highlighted as a way to provide agents with a consistent Figma-like UI. The post also touches on the integration with the Figma MCP server for viewing and changing generative plugins and shaders, and exporting shaders to agents for React code implementation.
Aug 2026Try these 10 skills—and show off your ownThis post introduces the concept of 'skills' for the Figma agent, enabling users to define custom instructions and prompts that guide agent behavior. It details how skills can be created, previewed, and iterated upon, and highlights 10 community-contributed skills that demonstrate diverse applications such as image auditing, motion design suggestions, component documentation, color token mapping, and design critique. The post also mentions the integration of these skills with Figma's MCP server for broader agent compatibility.
Advertisement
Aug 2026Measuring time savings from Figma MakeThis post details the methodology and results of a randomized controlled trial (RCT) designed to measure the time savings and efficiency improvements from using Figma Make. It explains the limitations of traditional A/B testing and causal inference for measuring AI impact due to confounding variables. The post outlines the design of the RCT, including participant selection (50 product designers, 50 product managers), task design (editing social media posts across three scenarios: dark mode conversion, adding a menu option, and building a comment interaction), and moderation strategies. Key findings include an overall 20% time reduction and 16% ease improvement, with PMs showing a 23% time gain. The post also analyzes how Make's impact differs between designers and PMs based on task complexity.
Jul 2026GPT-5.6 is now available in Figma MakeThis post introduces GPT-5.6 as the latest model available in Figma Make, highlighting its advancements in generating high-quality prototypes and code from prompts. It details GPT-5.6's ability to handle complex designs, self-heal from errors, and accurately replicate existing design files. The post also provides specific examples of prompts and their outputs, showcasing the model's improved performance in areas like aesthetic adherence, interaction fidelity, and responsiveness across screen sizes.
Jul 2026Got skills? Make the Figma agent a better collaboratorThis post introduces and details the concept of 'skills' for the Figma agent and Figma Make. It explains how skills are defined, their purpose in capturing team-specific workflows and expertise, and provides examples of their application in simulating feedback, upholding UX writing standards, and providing new user perspectives. It also highlights how skills can be used for recurring team rituals like catch-ups, crit prep, and crit recaps. The post further elaborates on the integration of skills with MCP connectors for interacting with external tools and the default sharing of agent chats in collaborative files to facilitate learning.
Jun 2026Code on the Figma canvasThis post introduces code layers as a new capability within Figma Design and Make. It details how users can add code layers from the toolbar, create them from existing frames, or generate them via the Figma agent. The post highlights the ability to import existing codebases (GitHub repos, local folders) and the bidirectional workflow of converting designs to code and vice-versa ('extract designs'). It also emphasizes collaborative features like commenting and prompting against code layers, and the ability to push changes back to a repository.
Jun 2026Connecting Figma and WeaveThis post details the integration of Weave tools directly into the Figma Design canvas, offering over 20 pre-built AI image tasks accessible from the left panel. It highlights the ability to use these tools for tasks like style transfers, product shoots, and material extraction with simplified UIs, and introduces the concept of publishing custom Weave workflows to the Figma Community as templates. The post also mentions the upcoming Figma node in Weave for tighter integration between design and creative production.
Jun 2026Figma’s design agent, now with custom tools and greater contextThis post details the expansion of the Figma design agent's capabilities, focusing on the creation of custom tools: generative plugins and shader effects. It highlights the use of WebGPU for shader rendering and introduces new methods for providing context to the agent, including attaching files, referencing other Figma files, web search, and integrating with external tools via MCP connectors. The introduction of 'skills' allows for the creation and sharing of reusable prompts and workflows within teams, enhancing the agent's ability to understand and adapt to team-specific processes.
May 2026What the design-to-code loop unlocksThis post details the advancements in the design-to-code loop, enabling bidirectional translation between Figma designs and production code. It highlights how AI is collapsing the distance between design and engineering by making the translation between canvas and code more semantic and less mechanical. The ability to go from code to canvas and vice versa allows for more fluid iteration and exploration. It also discusses how AI lowers the barrier to entry for collaboration and upskilling, enabling designers to participate more directly in the coding process and developers to leverage AI for massive undertakings.