Figma Can Now Build Its Own Tools. Here's What That Means for You.
Figma's design agent can now create custom plugins and shader effects on the canvas, animate them, and share them with your team or the wider community. For designers who are starting to build, this quietly changes what "knowing how to code" even means.
Figma's design agent can now generate custom plugins and GPU-powered shader effects directly on the canvas, and you can publish, share, and even export the underlying code. This is not a prototype feature or a waitlist. It shipped.
The reason it matters right now is simple: the gap between "I have a design idea" and "I have a working interactive thing" just got a lot smaller, without requiring you to open a code editor or learn WebGPU (a browser technology for high-performance graphics) yourself.
What Actually Shipped
The Figma team outlined four concrete updates in their behind-the-build post:
Community and internal publishing. Any plugin or shader you generate with the design agent can now be published to the Figma Community for anyone to use, or shared privately inside your organization if you are on an Organization or Enterprise plan.
Animated and interactive shaders. The agent can now bake motion and interactivity into visual effects. You describe something like a fluid distortion that reacts to the mouse, and the agent builds it. These are not looping GIFs. They are live, programmable effects running on the canvas.
Code access. You can now view and download the actual code behind any plugin or shader you create. This matters because it means a vibe-coded effect is not a black box. You can hand it to a developer, paste it into another AI tool, or just inspect it to understand what was generated.
MCP updates. Figma's MCP server (a way to connect Figma to external AI agents so they can read and act on your design file) now supports generative plugins and shaders. You can also export shaders for precise implementation in React code, which is the JavaScript framework (a pre-built system for building web interfaces) most product teams use.
The Thesis: You Can Now Design the Tools, Not Just the Screens
Here is the shift worth sitting with. Historically, if Figma did not have a plugin for something you needed, you had two options: wait for someone to build it, or hire someone who could. The design agent changes that loop entirely.
Figma's own team built the original shader prototype by vibe-coding a WebGPU environment and iterating with prompts. The author of the post notes that a shader effect that previously took months to engineer in Figma Draw could be recreated with one or two prompts. That is a signal about the kind of leverage now available, not just to Figma engineers, but to anyone using the tool.
For a designer who is starting to build their own app, this is the practical implication: you no longer have to wait for someone to give you the capability you need. You can generate it, test it on the canvas, and if it works, publish it so your whole team benefits.
How to Actually Put This to Work
Start with a specific, visual problem you keep running into. The more concrete, the better. "I want a noise texture that shifts slowly in the background of my hero section" is a better prompt than "make something cool." The agent responds to description the way a good developer responds to a clear brief.
Once you have a shader or plugin you like, hit the code access option and download what was generated. You do not need to read it fluently. But skimming it tells you whether the effect is simple enough to tweak yourself later, or complex enough that you should treat it as a dependency and leave it alone.
If your team is on an Organization or Enterprise plan, think about publishing internally before you publish to the Community. Internal publishing lets you pressure-test whether a tool is actually useful to more than one person, without the overhead of maintaining a public plugin.
For designers who are handing off to a developer or using an AI coding tool like Cursor or Claude, the MCP and React export path is worth exploring. It means the shader you designed in Figma can be implemented in code that actually matches what you built, rather than a developer approximating it from a screenshot.
Where This Gets Uncertain
A few open questions are worth naming. Performance is the honest caveat here. Figma's own team points out that a vibe-coded WebGPU prototype is "nowhere near the enterprise-scale, tile-rendered real thing." Effects that look great in Figma may need optimization before they perform well in a shipped product, especially on lower-end devices or slower connections.
There is also the question of maintainability. A generative plugin that one person created with a prompt is easy to build and easy to forget about. If it becomes load-bearing in your workflow or your product, someone eventually needs to understand it well enough to update it. The code access feature helps here, but it does not solve the problem entirely.
None of that cancels the headline. For designers who are building, the ability to generate, animate, share, and export custom tools from inside Figma is a genuine expansion of what you can ship on your own. The craft question, as always, is knowing when to reach for it and what to do when it breaks.