Claude Design. “Output isn’t design.” Color tokens.
Sponsor
Visual usability insights directly in Figma
Visual Usability Checker allows you to test your design and get AI recommendations to improve hierarchy, reduce cognitive load, and refine specific parts of it. Design with clarity, iterate faster, and make confident decisions before launch.
What's New
Figma CEO on How to Get Good at Design in the AI Era
Dylan Field in an interview with Peter Yang argues that AI will massively expand what’s possible in design, but the enduring edge for humans is judgment: taste, craft, and point of view, plus the ability to use AI as an iterative partner rather than a one-shot generator.
Color-agnostic state overlays vs. per-intent state tokens
David Hill explores implementation options for a color system, and Matt Sellers, design lead at Lovable and Reshaped, shares the color token architecture he chose for Lovable’s upcoming design system. The core decision: color-agnostic state overlays (a small set of OKLCH alpha composites) vs. per-intent state tokens (one hover/pressed value per color × per state × per variant). His case for Option 1 is architectural — the state layer and color layer stay independent, so adding a new intent color requires zero new state tokens. The thread goes deep on OKLCH derivation engines, pseudo-element stacking, and the Figma implementation tradeoffs.
Advanced Icon Design: Dots
Helena Zhang kicks off a series on advanced icon design with a simple but non-obvious principle: dots in icons should be slightly larger than the stroke weight to look optically balanced, a rule borrowed directly from type design. The kind of detail that instantly improves an icon set once you see it.
This Is What Magic Looks Like Now
Carina B. Velasquez, a Design Systems Lead locked out of AI tools at work, spent a Friday afternoon on her personal laptop with Claude Code and the Figma MCP server. By 6pm she had built Prisme: a complete three-tier token system, four brand themes, and a bidirectional plugin (Prisme Bridge) translating between Token Studio and native Figma variable formats. Her conclusion: “AI is amazing, Claude Code built my design system for me, the future is here. That is not what happened. What happened is that I showed up with years of accumulated knowledge, a specific problem I understood deeply, and a clear enough mental model to describe what I wanted with precision. Claude Code was fast; impressively fast, and smart in ways that genuinely surprised me. But it was executing a vision I already had. The intelligence in that Friday afternoon was not artificial.”
Claude Design
Introducing Claude Design by Anthropic Labs
Anthropic launches Claude Design, a new product that lets you collaborate with Claude to create designs, prototypes, slides, and more. Powered by Claude Opus 4.7, it reads your codebase and design files during onboarding to build your team’s design system automatically, then applies it to every project. This release kicked off many interesting conversations in the community, some of which I gathered below.
Design vs. design production tool
Rasmus Andersson, creator of Inter and former principal designer at Figma, draws the sharpest distinction in the launch coverage: “This is really neat but it’s not a design tool as much as it’s a design production tool. The practice of design is mostly about what comes before production.”
Output isn’t design
Karri Saarinen, CEO of Linear, makes a similar point that AI design tools conflate producing interfaces with designing them, leaning on Christopher Alexander’s “Notes on the Synthesis of Form” to make the case that real design is the search for fit between form and context, not the generation of form itself. He points to a visible symptom: AI-assisted products that look polished but unravel under use, full of decisions that were never genuinely worked through.
A confusion in terminology
Soleio (designer, angel investor) draws a three-way taxonomy to cut through the noise: production design gets automated on economic grounds; strategic design expands its medium set to include live production experiments iterated by agents; and exploratory design actually grows in importance because humans and machines together can traverse a far larger combinatorial space of novel forms. The real competitive edge, he argues, shifts to “problem-finders” who build new systems for channeling desire: “The inputs and systems we create to find opportunities will reward the most intrepid problem-finders. Design stops being a method of sitting and ruminating on possible forms or solution spaces. Design becomes active, research-based, and built around speed of discovery and expression.”
Yes, and
Ben Blumenrose offers a useful counterpoint to the critical takes: “What if it’s not a Claude Design vs. Canva vs. Figma vs. xxx but a ‘yes and’ as millions more people are exposed to design and use this accessible tool to begin a journey into being better at type, color, composition, effective communication, building great experiences, etc?”
Thoughts and Feelings around Claude Design
Sam Henri Gold argues that Figma’s decade of components, variables, and tokens has become an overgrown, pre‑agentic system that no one would design from scratch now that LLMs work directly with code. He frames Claude Design as “truth to materials”: HTML/JS-first, tightly coupled to Claude Code, and better aligned with a future where the source of truth moves back into repositories instead of opaque design files. The interesting provocation is his prediction that tooling will split in two—agentic, code-native tools like Claude Design on one side and pure, system-free exploration playgrounds on the other—leaving Figma facing its own “Sketch moment” unless it radically rethinks what it’s for.
Design for pre-PMF products
Paul Stamatiou with the first impression most experienced designers will relate to: Claude Design didn’t land on first try, but the trajectory outlined by Sam Henri Gold is unmistakable. Lately, I’ve been working in pretty much the same way: “So much of my iteration happens directly in the code, Figma is where the direction gets sorted out, then it gets a million iterations and refinements in code. The last thing a designer on a team moving at hyperspeed wants to do is backport designs in code back to Figma to maintain a single source of truth.”
Comparing Claude Design to Diffui
Jacob Miller left the PM role at Figma to build Diffui, a new way to approach the design to dev process with AI. In this thread, he compares designs generated by his tool and Claude Design. One is more expressive and diverse, another is more polished and organized. The point is not that one is better than another, but how can we combine different approaches and tools to get to the most interesting result.
Figma Design
Swap Instance vs. Slots
Hugo Raymond breaks down Swap Instance vs. Slots as two ends of a control–composability spectrum: Swap Instance hard-locks a single nested component in a fixed position, while Slots act like open containers that accept almost anything and can be freely rearranged. For design system teams, his key point is that the “right” choice isn’t about which feature is more powerful, but about how much you trust consumers of your components and whether you fear incorrect composition more than full detachment from the library.
FigmaLint
FigmaLint is an AI-powered plugin that audits Figma components for design system compliance, accessibility, and developer readiness. It surfaces hard-coded values, naming issues, and missing interaction states, then helps you fix them directly — binding to design tokens, renaming generic layers, staging component properties.
Volume — 3D OKLCH Color Picker & Palette Generator
A color picker that operates in actual color space geometry rather than approximating it. Volume lets you explore the 3D OKLCH space and adjust hue, chroma, or lightness independently, and push palettes directly into Figma Variables.