Generate a design kit in Figma Make and the output includes a global CSS file. Its variables arrive as raw values, and Figma says the variable syntax is not preserved exactly as defined. That file raises this review’s question: what can an AI agent perceive, write, and verify inside Figma Make? This is a documentation-based review. We read Figma’s published help, developer, pricing and blog pages, fetched 2026-11-02, and did not run Figma Make ourselves. Verdict first: Make is strongest where structured design input becomes code, and weakest wherever an agent must touch tokens, the canvas, or the published URL.
At a Glance
Figma Make is Figma’s prompt-to-app tool, launched May 7, 2025, for turning designs and ideas into functional prototypes and web apps through conversation. It is included on the Full seat, and publishing runs through Full seats on paid plans, while Starter users can publish to the public web only if they also publish to the Figma Community. Its workspace has three tabs, and its credits meter every prompt. Documentation verified 2026-11-02.
- Workspace tabs: Browser (preview plus editing tools), Files (browse and edit the app’s code), and Review (inspect code changes as additions and deletions in changed files), per Figma’s Make explainer.
- Seats and plans: Available on Starter, Professional, Education (not K-12), Organization, Government and Enterprise. Dev, Collab and View seats can “try Figma Make in drafts”. Organizations and Enterprises need AI features enabled, per the Make FAQ.
- Price points: Starter is free with “150 AI credits/day, up to 500 AI credits/mo”. A Professional Full seat is $16/mo with 3,000 AI credits/mo, per Figma’s pricing page.
Credit model. AI credits are consumed each time you send a prompt, and the amount “varies based on factors such as the model you use, the complexity of the task, and the volume of context the model processes”. Seat credits belong to one user, reset monthly, do not roll over, and cannot be shared. Admins can buy a subscription pool and/or enable pay-as-you-go up to a monthly spending limit, and subscription credits are consumed first (Figma credit help).
Publish model. Publishing gives the app its own URL, shaped like three-random-words.figma.site. Changes reach the published site only after you publish an update (publishing guide).
How We Tested
This review is based on Figma’s official documentation, pricing page, and product blog — we did not run Figma Make ourselves. Every factual claim traces to a page fetched on 2026-11-02 from Figma’s help centre, developer docs, pricing page, or launch blog. Where the documentation is silent, the comparison table says so rather than filling the gap. Last reviewed: November 2026
What It Does Best
Figma Make’s most agent-legible channels carry structure: attached frames and components, an editable plan.md, markdown Skills, a guidelines.md read on every prompt, git round trips, and Make files exposed as MCP resources. Each one leaves an artifact you can check.
- Frames as structured input. Figma’s guidance is to attach frames rather than images, because “Frames contain structured design data, so the model doesn’t have to interpret visual information the way it does with a screenshot” (creating and editing a Make file).
- Plan as an artifact. Plan mode “creates a plan markdown file” that you can edit, with no limit on refinements, before you click Build (plan mode).
- Skills as files. Skills are “Markdown files that follow the Agent Skills specification” (Agent Skills spec), invoked with a slash command and available across all files (custom skills).
- Standing instructions. A
guidelines.mdfile is read automatically on every prompt, so you do not restate it. - Review diffs. The Review tab shows additions and deletions per changed file, a verification surface that needs no screenshot.
Where It Falls Short
The seams sit where Figma’s own documentation says the model cannot read what you care about: exact colors in images, the contents of pasted links, tokens after kit extraction, pasted layers, and the published site before you publish. Each seam is documented, so each can be designed around.
Our principle for this review is that lossy seams are the interface. A documented limit is a routing table. It tells you where durable intent belongs and where verification must happen, instead of a defect to hope past. We apply it below to the token layer and to the publish gate.
Token fidelity is the first seam. Kits “pull a subset of your variables” into a global CSS file “with raw values”, so variable syntax “won’t be preserved exactly as defined” (Make kits). The publish gate is the second. Changes appear on the published site “only after you publish an update”, so a pipeline that verifies against it gets stale answers.
Two more seams matter. Pasted layers from a Make preview are snapshots, not live links. Starter lacks team libraries for style context. Every prompt reprocesses the accumulated history, so long sessions cost more.
Agent’s Deep Dive
This section follows one question across five channels: what the agent perceives, which interfaces it can call, what it can write to the canvas, what survives as a durable artifact, and which design signals leak, get fixed, or stay hidden.
Machine-readable output format
Make produces four machine-readable outputs. App code appears in the Files tab. The Review tab reports per-file additions and deletions. plan.md holds the editable plan. The kit-generated global CSS holds raw values for a subset of variables. Figma’s MCP server adds get_metadata, which returns “a lightweight XML outline” of a design, so an agent can scan structure before it requests detail (MCP tools). Only the first three are artifacts that Make itself writes into your project.
MCP and CLI exposure
Make acts as an MCP client and as an MCP resource provider, and the docs describe no CLI.
Make as client. Figma lists 22 verified-partner connectors, including GitHub, Notion, Slack and Linear (verified partner connectors). Tools that write to external sources are disabled by default. Each tool has “Ask to run”, “Always run”, or “Never run”. With “Always run”, downloads can fail above a 16 MB response cap, and large images of about 5–6 MB can exceed it after encoding. Figma adds: “Be wary of prompt injections from external sources when pulling in context.” Custom connectors require a paid plan.
Make as resource provider. Copy a Make file URL, paste it into an MCP client, and the agent lists the project’s files so you can choose which ones it uses. This requires view access and “an MCP client that supports MCP resources” (bringing Make context to your agent). That page lists Starter, Professional, Education, Organization and Enterprise, without Government; the FAQ availability list includes Government. We report each page as written.
CLI. No CLI is documented in the reviewed docs. The closest local workflow is “Make in your local codebase”, a closed beta for the Mac Figma Beta desktop app. It is not generally available. For the full tool list, see our field guide to the Figma MCP server’s tool contract.
Canvas read and write
Read. Attach frames or components. Pasted file links fail: “Figma Make will not get content from your file via the URL”, and “occasionally the model will attempt to interpret the content of the URL itself”. A design must be a component or sit inside a frame to be attached.
Write. Writing native canvas content (frames, components, variables, auto layout) requires the remote MCP server and a Full seat to write outside drafts. Figma says this is “free during the beta period and will eventually become a usage-based paid feature” (Figma MCP server).
Copy as layers. “Copy a Figma Make preview as design layers” is available on Professional and above, not Starter. Available variables “will be matched and bound to layers”, which makes this the one documented place where variable binding survives. The result is a snapshot. It is not connected to the Make file, not automatically tied to your design system, and not interactive (copy as design layers).
Code round-trip
Export code is available on Full and Dev seats, and in drafts for Collab and View seats (Make FAQ). The git path lets you clone a GitHub repository, work in branches, push changes, or open a pull request, moving through draft PR, Ready for review, and Merge (repository requirements).
Repositories must be frontend web apps that install and run locally, with an entry point, a build script, and under 3 GB. VPN or allowlist repos, login-gated private npm packages, and native mobile or desktop apps are unsupported. An uploaded local folder, up to 100 MB, has no live GitHub connection. The beta local-codebase variant saves “each prompt that changes code” as a local commit. For how design-to-code exporters look from an agent’s side, see design-to-code exporters seen through an agent’s lens.
Design signals: leaked, fixed, hidden
- Leaked: a subset of variable names survives kit extraction, and paste-as-layers matches and binds variables.
- Fixed: raw values are baked into the global CSS, variable syntax is not preserved, and pasted layers are frozen snapshots.
- Hidden: rules the simplified CSS cannot capture, which Figma routes to
guidelines.md; anything conveyed only by an image, such as exact colors; and anything behind the publish gate.
Token behaviour in pipelines is covered in design-token modes and resolver contracts.
Choosing Between Make and the Other Paths
Pick the path by the channel you need: structured design input, code egress, canvas write-back, or a public URL. The table maps each path to the channel it supplies. Figma-sourced cells come from the pages above. Anything the docs do not cover reads “not documented here — verify locally”.
| Path | Agent input channel | Documented machine interface | What an agent can write | Verification artifact | Variable-token fidelity ceiling | Gate |
|---|---|---|---|---|---|---|
| Figma Make on a Full seat | Attached frames or components; prompt text | Verified-partner MCP connectors; Make kits; Files and Review tabs | App code; published URL after publish | Review-tab additions/deletions diff; plan.md |
Raw-value global CSS subset; variable syntax not preserved exactly | Full seat (Make included); publish and share Full only |
| Figma Make in drafts (Dev / Collab / View) | Designs attached “in drafts” for Dev, Collab, View | Verified-partner MCP connectors; code editor, point-and-edit and style context in drafts (per the FAQ matrix) | App code via export (Dev; Collab/View in drafts) | Not documented here — verify locally | Not documented here — verify locally | Dev, Collab, View seats; drafts only; publish is Full-only on paid plans |
| Figma Make + git round trip | Cloned GitHub repository | git: clone, branch, push, pull request | Repo changes via push or PR | Pull request (draft, Ready for review, Merge) | Not documented here — verify locally | Repo requirements apply; seat not documented here — verify locally |
| Make file → external agent via MCP resources | Make file URL pasted into an MCP client | MCP resources (client must support them) | Code reused in your own codebase | Not documented here — verify locally | Not documented here — verify locally | View access; Starter, Professional, Education, Organization, Enterprise |
| Figma MCP server + your own coding agent | Figma Design file read via get_design_context, get_metadata |
Figma MCP server tools, including get_variable_defs |
Native canvas content; writes need remote server and Full seat outside drafts | Not documented here — verify locally | get_variable_defs is a read tool; ceiling not documented here — verify locally |
Remote-only tools absent on desktop server; Full seat for writes |
| Hand-built prototype | Not documented here — verify locally | Not documented here — verify locally | Not documented here — verify locally | Not documented here — verify locally | Not documented here — verify locally | Not documented here — verify locally |
Use the Make path when your agent needs structured input and code output. Attach frames, keep rules in guidelines.md, and verify in the Review tab or a commit. Use the git round trip when code must land in a repository you already own. Use the MCP resource path when another agent should reuse Make’s files in its own codebase. Use the Figma MCP server path when the agent must read exact variable definitions or write to the canvas, and accept the Full-seat gate for writes. For a wider comparison of AI app builders on agent readability, see comparing AI app builders for agent readability.
Four computable rules decide whether your pipeline is sound:
- Token survival. Open the global CSS your kit generated and search for
var(--. Zero matches means token names did not survive extraction, so token fidelity fails. If matches exist, cross-check three values against your published library. A mismatch downgrades fidelity to partial. Keep state rules inguidelines.mdeither way. - Input channel. Pass when design input is an attached Figma component or frame. Fail when it is a screenshot, since exact values such as colors are not reliably extractable. Automatic fail when the workflow pastes a Figma file URL into the chat.
- Publish lag. Pass when verification runs against the preview and the Files/Review artifacts, and the published URL is a separately gated stage. Fail when a pipeline fetches the published URL to verify a prompt’s effect, because changes appear there only after you publish.
- Credit hygiene. Pass when standing instructions live in
guidelines.mdand long sessions restart from a duplicated file or a published template. Duplicating costs no additional credits and gives a clean history; publishing a template strips accumulated history. Fail when a runbook iterates on a long-lived file and restates standing instructions in every prompt.
FAQ
Can Figma Make build an app from my existing Figma design?
Yes, with conditions. Designs must be attached as a component or sit inside a frame. Attach frames rather than images, because frames carry structured design data. Pasting a Figma file link into the chat does not work, since Make “will not get content from your file via the URL.”
Does Figma Make preserve my design tokens and variables?
Not exactly. Make kits pull a subset of variables into a global CSS file with raw values, and “variable syntax won’t be preserved exactly as defined.” Variables are matched and bound only when you copy a preview as design layers, which requires Professional or above. Put state rules in guidelines.md, because the extracted CSS “won’t capture every design detail.”
How do AI credits work in Figma Make, and why does it use so many?
Credits are consumed each time you send a prompt. The amount varies with the model, task complexity, and the volume of context processed. Make reprocesses accumulated prompt history on every prompt, so long sessions cost more. Documented drivers include an unscoped first prompt and the wrong model for the job. Figma does not publish a per-prompt price.
Can I export Figma Make code or push it to GitHub?
Yes, within the seat matrix: Full and Dev can export code, and Collab and View can do so in drafts. Through git you can clone a GitHub repository, work in branches, and push changes or open a pull request. An uploaded local folder of up to 100 MB works too, but it has no live GitHub connection.
Can I connect my own AI agent to Figma Make files?
Yes, as an MCP resource. Copy the Make file URL, paste it into an MCP client that supports resources, and the agent lists the files so you can choose which ones it uses. You need view access. The docs describe no CLI, and the closest local workflow is a closed beta for Mac.
Do Figma Make apps update the published site automatically?
No. Changes to the app appear on the published site only after you publish an update. Publishing runs through Full seats on paid plans, and Starter users can publish to the public web only if they also publish to the Figma Community. Treat the published URL as a separately gated stage, and verify prompts against the preview and the Review tab instead.
The Bottom Line
Figma Make is strongest as a channel that perceives structured design and writes code, with real verification artifacts in diffs, commits, pull requests, and plan.md. It is weakest wherever the agent must write to the canvas, depend on the token layer, or verify against the published URL.
In perceive, write, and verify terms: the agent perceives frames, guidelines.md, and Skills well. It writes app code, commits, and pull requests well, and canvas writes need the remote server and a Full seat. It verifies against the Review tab and commits, and never against screenshots or the published URL.
The verdict flips if your pipeline needs exact token values or canvas writes outside drafts. Then the route is the Figma MCP server with your own coding agent, where get_variable_defs is a documented read tool and canvas writes require the remote server and a Full seat.