Every Frame Perfect. A2UI. New in the Figma MCP.
Sponsor
Every ‹div›RIOTS Figma tool – One subscription
HTML, PDF, PSD, AI, Code, Office, 3D… — ‹div›RIOTS turns any file format or code into fully editable Figma layers. 20+ plugins, a browser extension, web tools, and an API. One subscription for everything.
What's New
Show your hands honor for the strange power they bring you
Marcin Wichary, Design Architect at Figma, made this interactive essay about fingers, latency, and why our interfaces still fail the hands using them. Starting with 1890s typists who routinely hit 70 wpm when scientists said 40 was the ceiling, he traces a direct line from terminal echo buffers and UI blocking to Notes on a Mac that can’t keep up with your typing in 2026. The embedded demos — where you feel the difference between a blocked UI and a parallel thread — do more to explain debouncing and latency than any amount of text could. This essay is a fantastic companion to Marcin’s Unsung blog on software craft and quality.
Every Frame Perfect
Nikita Prokopov makes the case that great UI isn’t just about nailing the start and end states of an animation, it’s about every frame in between. His rule of thumb: if you freeze the screen at any moment, you should be able to explain what you’re looking at. The post walks through a set of GIF examples — from Safari’s misaligned cursor-and-placeholder animation to YouTube’s inexplicable rectangle transition — showing how mid-animation frames that don’t hold up on their own erode user trust.
A bull case for Figma: owning prototype coding is more valuable than production coding
“As code becomes cheaper, an increasingly large portion of it is written for prototyping, not production.” Yitong Zhang argues that prototype coding and production coding are diverging into distinct disciplines with near-opposite requirements: prototyping wants speed, mock data, no types, no tests, and wide-ranging agents; production wants the opposite. Cursor, Stripe, and Notion have already shown this with their internal playground environments — and Figma just needs to follow that path. Parallel design exploration means more inference runs, less complexity per run, and better margins than production – making Figma one of the best-positioned companies outside the labs to run agents at scale.
Design Systems
A2UI under the hood. Designing for the new era of radically adaptive UI.
Christine Vallaure walks through how A2UI, a Google-initiated open protocol, turns a designer’s component catalog into the sole source of truth for AI-generated interfaces. The AI assembles screens fresh for each user request, but it can only name components that already exist in the catalog — so the quality of every screen traces directly back to design decisions made upstream. The interesting flip: the careful work designers often do invisibly, states, tokens, semantic naming, accessibility, stops being a tax and becomes the engine.
A color system that disappears
Matt, designer at Lovable, writes up how they rebuilt their entire color system on OKLCh, derived from just three inputs: a neutral seed, a contrast value, and an accent. The technical choices are solid throughout — perceptually uniform ramps, WCAG contrast by construction, box-shadow borders that composite without layout shift, the state layer — but the most interesting design decision is the intentional reduction of token surface area specifically to make AI-generated UI more consistent. The fewer valid choices a model has, the less it can quietly go wrong.
Figma Design
Search the web in the Figma design agent
The Figma design agent can now search the web. Type “search the web”, add a URL, or use the plus menu in the agent chat to pull in live content, reference real design patterns, and replace placeholder text and images with actual material.
Organize the way you work with new tab groups
Tab Groups brings folder-like organization to the Figma desktop app’s tab bar. You can group tabs by project, theme, or workflow, assign a color to each group, and collapse or expand them to stay focused without losing access to open files. A nice improvement for anyone working across multiple projects.
MCP
New in the Figma MCP server: Slides, uploaded fonts, and more
Four updates to the Figma MCP server: Slides support so agents can create and update presentations from your templates, local uploaded font rendering instead of web-safe approximations, a new download_assets tool for exporting JPG, SVG, and PDF files directly out of a Figma file, and Xcode compatibility for bringing mobile designs into Xcode to preview screens.
4 ways we're using our MCP server at Figma
Mari Kong rounds up four real workflows Figmates are running with the MCP server now that it spans Slides, FigJam, Make, and the Figma agent. Mallory Dean refreshes her AI product launch deck from Slack and Google Drive with one prompt. Prasant Lokinendi generates FigJam kickoff boards from live Asana, Notion, and Hex data. Iris Lin moves designs bidirectionally between canvas and code, ending in a GitHub PR. Yarden Katz drops a code-only screen into Figma, maps it to real components, fixes it with the Figma agent, then pushes it back. None of these are demo scenarios — they’re the actual recurring work.
Figma Code Connect explained in 5 minutes (MCP + design systems)
Jake Albaugh, Developer Advocate at Figma, walks through setting up Code Connect from scratch — the NPM package, the config file, and mapping design properties to production code properties. The real payoff comes when he shows the before/after through the MCP server: without Code Connect, an agent sees a flood of raw style data; with it, it sees clean, minimal component code it can actually act on. Unfortunately, Code Connect is still not available on the Pro plan.
Figma Sites
Workspace-level web publishing
Web publishing in Sites and Make has been an all-or-nothing setting. Now admins can set an org-wide default and carve out exceptions per workspace, so security-sensitive teams stay locked down without blocking everyone else.