Figma pulled in $333.4 million in Q1 2026 revenue, a 46% jump year over year, and on May 20 the company launched the product that explains the ambition: a native AI design agent that lives directly on the Figma canvas. Eight days later, on May 28, Figma followed up with a coding agent inside Figma Make that connects to your actual codebase and writes code from within the design tool. Both features are free during beta.
These are not “generate an image from a prompt” tools. The Figma AI design agent generates structured, layered, editable design that respects your component library, your tokens, and your variables. For creators who use Figma for thumbnails, social graphics, app prototyping, or client work, this changes the daily workflow.
What the Agent Does on Your Canvas
The agent sits in Figma’s left rail, alongside your layers panel. You type a natural language prompt, and it generates or modifies design directly in your file.
Here’s what separates it from a chatbot that outputs images:
Component awareness. The agent reads your design system. It knows which components you use most frequently, which tokens govern your spacing, and which variables set your color palette. When you ask for “a pricing card in our brand style,” it builds with your actual components rather than generating a generic wireframe from scratch.
Multi-agent execution. You can fire off several prompts simultaneously. One agent generates three layout variations for a landing page while another resizes your social assets for Instagram Stories. They work in parallel on the same canvas.
Structured output, not flat images. Every element the agent generates is a real Figma layer: text boxes you can edit, frames you can resize, components you can swap. Nothing is rasterized. This is the core difference between Figma’s approach and image generation tools that produce flat PNGs.
Specific tasks the agent handles well, according to Figma’s launch blog:
- Generate multiple stylistic explorations of the same layout (organic, modern, retro)
- Convert an entire file to dark mode
- Replace lorem ipsum across a project with realistic copy
- Standardize naming conventions in a design system
- Document components with all states and variants
- Summarize design review comments by theme
Loredana Crisan, Figma’s chief design officer, framed it this way in the TechCrunch coverage: “Teams can now collaborate with agents on the multiplayer canvas to test out ideas, visualize edge cases, and refine concepts.”
The Model Behind It
Figma built the agent on models fine-tuned specifically for design, not repurposed general-purpose LLMs. The company has not published training benchmarks, but the distinction matters in practice. General-purpose image generators treat every pixel equally; Figma’s model understands hierarchy, layout grids, component structure, and token inheritance.
The company also partnered with both Anthropic and OpenAI earlier in 2026 to build MCP (Model Context Protocol) integrations. Claude Code and OpenAI Codex both connect to Figma through MCP, creating a pipeline where AI-generated code can become editable Figma design, and Figma layouts can inform code generation. The native design agent is a separate product from those integrations, but they share the same underlying infrastructure.
Figma Make: The Coding Agent That Followed Eight Days Later
On May 28, Figma launched a limited beta for Figma Make’s new coding capabilities. Make already turned designs into HTML, CSS, and JavaScript. The new agent goes further: it connects to your local codebase and makes edits directly.
The workflow:
- Point Make at your code repository
- Annotate a design element or describe a change in natural language
- The agent writes the corresponding code
- Review the changes in Make’s built-in editor
- Commit and open a pull request without touching a terminal
For creators who prototype in Figma and build in React (or any frontend framework), this collapses the handoff step. You design a component, the agent writes the React code, and you push it to GitHub. The round trip that used to involve copying specs, translating them into JSX, and debugging layout discrepancies now happens inside one tool.
Make also supports MCP integration, so you can paste a Figma frame URL into Claude Code or another AI coding tool and get your design system’s real components fed into the prompt context.
Who Gets Access and What It Costs
Both the design agent and the Make coding agent are free during beta. No AI credits consumed. At general availability, standard credit usage will apply (Figma has not published rates yet).
Plan requirements:
| Plan | Monthly cost per seat | Design agent | Make coding agent |
|---|---|---|---|
| Starter | Free | No access | No access |
| Professional | $12 (annual billing) | Full access | Full access |
| Organization | $45 (annual billing) | Full access | Full access |
| Enterprise | Custom | Full access | Full access |
Collab and Dev seats can use the agents in draft files only. Education and Government plans are excluded from the beta.
The rollout is gradual. Sign up at the Figma waitlist to be notified when access opens for your account. Joining does not guarantee early access.
Where This Fits in the Creator Design Stack
Figma’s agent occupies a specific lane. Here’s how it maps against the tools creators are already using:
Canva AI 2.0 launched its own agentic system in April 2026, powered by Canva’s proprietary Design Model. Canva targets quick social content and marketing materials. Figma targets interface design, prototyping, and design systems. If you make YouTube thumbnails and Instagram carousels, Canva is the faster path. If you design app interfaces, dashboards, or branded component libraries, Figma’s agent is built for your workflow.
Claude Design generates polished visual designs from conversation. It excels at producing standalone designs quickly. Figma’s agent works inside an existing design file with your existing components. These tools complement each other: Claude Design for the cold start, Figma’s agent for iteration within your system.
Google Pics (launched May 27, 2026 inside Workspace) targets presentation graphics and document illustrations. Different use case entirely.
Krea AI runs 64+ models for real-time creative generation. It is a creative exploration tool. Figma’s agent is a production design tool. Different stages of the same pipeline.
The honest summary: if you already pay for Figma, the agent is a significant upgrade at no additional cost during beta. If you don’t use Figma, this alone may not justify switching. The $12/month Professional plan is reasonable for freelance designers and indie makers, but the real value compounds when you already manage a component library and design tokens in Figma.
Three Workflows Worth Testing During the Free Beta
Thumbnail and social asset batch generation. Set up your brand components (colors, fonts, logo placement) in a Figma library. Prompt the agent to generate five thumbnail variations for a video topic. Each variation uses your real brand elements, not a generic template.
Client mockup acceleration. Freelance designers spending hours on initial mockups can prompt the agent for three layout directions, then refine the strongest one manually. The first 80% of exploratory work collapses into minutes.
Design-to-code prototyping. Using Figma Make’s coding agent, build a component in Figma and push React code to your repo in the same session. For creators building SaaS tools, membership sites, or digital products with vibe coding workflows, this removes the most frustrating translation layer between design and code.
Beta Limits and Open Questions
Figma’s agent is still in beta, and the gradual rollout means most users won’t have access immediately. A few things worth tracking:
Credit pricing at GA. The free beta is generous, but heavy users need to budget for AI credits once general availability arrives. Figma hasn’t published rates. Compare to Canva’s model, where AI features are bundled into paid plans without per-action metering.
Design system depth. The agent’s value scales with how well your design system is organized. Clean files with proper components, tokens, and naming conventions produce strong results. Messy files inherit that mess into the agent’s output.
The MCP bridge. Figma’s MCP integrations with Claude Code and Codex create a genuine design-to-code loop. This is the long-term play: design in Figma, code with AI, and keep both in sync through a shared protocol. Creators building products should watch this integration space closely over the next few months.
Figma shipped the AI design agent on May 20 and the Make coding agent on May 28. Both are free during beta on Professional plans and above. For creators already in the Figma ecosystem, the upgrade path is straightforward: open the sidebar and start prompting.
Recent Posts
Luma Ray3.2 introduces 16-keyframe control, 8-face tracking, and HDR EXR output. A closer look at how the model changes AI video production for creators.
ElevenLabs Music v2 Gives Creators an AI Music Editor They Can Actually Monetize
ElevenLabs Music v2 adds section-by-section editing, mid-track genre switching, and embedded sound effects to AI music generation, all built on licensed training data with clear commercial rights.