Figma Make: Visual Codebase Editing and GitHub Integration
FigmaFigma launched a limited beta of Figma Make for Local Code on May 28, 2026, enabling designers and product managers to visually edit a live production codebase directly from the Figma canvas — without touching a terminal. Users connect a Git repository to Figma Make, select UI elements to adjust properties (layouts, colors, fonts, spacing), and an AI agent locates and rewrites the underlying code accordingly. Changes accumulate as local commits and can be pushed to engineering as standard GitHub pull requests, keeping existing review workflows intact. The beta is currently limited to the Figma Beta desktop app on macOS; credits are not consumed during the beta period.
Sources & Mentions
3 external resources covering this update
Overview
Figma Make for Local Code entered limited beta on May 28, 2026, extending Figma Make beyond in-browser prototypes to live production codebases. The feature lets designers and product managers make visual UI edits directly from the Figma canvas, with an AI agent translating those edits into real code changes — no terminal required.
Workflow: Connect GitHub, Auto-Setup, Edit Visually
The setup flow is straightforward: connect a GitHub repository to Figma Make, and the tool automatically clones the repo, installs dependencies, and spins up a local dev server. Once the project is running, a live preview appears in the Figma canvas alongside the editing tools.
Three Editing Modes
Figma Make for Local Code supports three ways to interact with the codebase:
- Direct property editing — Select a UI element in the preview and adjust properties like layout, colors, fonts, and spacing using familiar Figma controls. The AI agent locates the relevant code and rewrites it accordingly.
- Annotations — Leave contextual notes on the design that guide the AI agent on what to change and how.
- Chat prompting — Describe changes in natural language via a chat interface; the AI interprets the intent and applies the corresponding code edits.
Git-Native Workflow: Commits and Pull Requests
All changes made through Figma Make are written as local commits, preserving the full Git history. When a designer is ready to hand off their changes, they push to GitHub and open a standard pull request — keeping engineering review workflows completely intact. This means design changes flow through the same governance and approval processes as any other code change.
Design-to-Code Loop: Copy Back to Figma Design
Figma Make for Local Code supports a feedback loop: after editing the live codebase, designers can copy the changes back into a Figma Design file for documentation, stakeholder review, or further iteration. This keeps the design file and codebase in sync without requiring manual re-drawing.
Availability and Constraints
- Limited beta: Access is restricted; users must join a waitlist or be invited.
- macOS only: The feature requires the Figma Beta desktop app on macOS — not available on Windows or in the browser.
- No credits consumed during beta: Figma Make credits are not charged during the beta period.
- One-directional sync: Changes flow from Figma Make → GitHub only. The reverse (syncing code changes back into Figma Make automatically) is not supported.
Positioning vs. Cursor and Claude Code
Figma Make for Local Code enters a space already occupied by AI coding tools like Cursor and Claude Code. The key differentiator is the entry point: while Cursor and Claude Code are text-first tools aimed at developers, Figma Make is visual-first and aimed at designers and PMs who want to make UI changes without learning a codebase. The pull request output means engineering teams receive a reviewable artifact rather than a verbal brief.