Thoughts on Claude Design and Figma Challenges
A designer tried Claude Design on April 18, 2026, and formed a theory about the future of design tools. Product teams grew larger, and design groups had to prove their value within engineering organizations. This led to efforts to systematize design processes. Figma created its own basic elements to support this: components, styles, variables, props, and similar features. Some ideas came from programming concepts, others did not, and nothing aligned perfectly with code. Guidelines changed over time, updates accumulated, and automation relied on a few unreliable plugins. The setup became so complex that some design jobs now focus solely on managing the system.
Tension Between Figma and Code
Design tools like Figma always faced conflict with code about which should serve as the main reference. Figma gained ground against Sketch by claiming its tools as the standard source. That success came with a downside. Figma used a closed, mostly undocumented file format hard to handle with programs. This kept Figma out of the data used to train large language models. Those models learned from code, not Figma's elements. Now code grows simpler for designers to handle, and AI agents improve steadily. The primary reference point will return to code. Figma's elaborate features from the last ten years will seem excessive. People will question working in an imperfect version of the final product when they can edit it directly where it belongs. The analogy fits: to create pottery, people should shape clay instead of drawing pictures of pots.
At the designer's workplace, teams often updated Figma files with changes made straight in code. This process proved frustrating. For comparison, Figma's own design system file for its product shows the issues. Experts likely built it. Still, problems persist. The variables panel lists 946 color variables in nested groups such as "bg/desktopBackgrounded." One selected variable displays eight mode-specific values: Light, Dark, FigJam-Light, FigJam-Dark, DevMode-Light, DevMode-Dark, Slides-Light, and Slides-Dark. A modal footer component opens to its variant editor with 12 variants. A dropdown holds options like "DS Library Swap," "QA Plugin," "Growth Stepper," and "Sharing Actions." The right panel shows eight props including "Border," "Second CTA," and "Helper Text." The effects styles panel for a slider lists "light/elevation-300-tooltip." It expands to a 0.5px drop shadow at 30% black, named that way to note its CSS variable link. A combo input holds 16 variants. Its layers panel names children like "Default, Default, Close Button=False" and "Default, Focused, Close Button=True."
Complexity in Figma's Gold Standard Files
These details come from Figma's internal files, created by their team. They represent the best example available. Fixing a wrong color means checking the component, which links to a variable. That variable points to another, tied to a mode overridden at the instance. The instance sits in a nested component with a library swap. At that stage, many prefer switching to code or leaving for a simpler life, like farming sheep, to avoid the frustration.
With the reference shifting to code, Figma holds a manual system from before AI agents, unfit for new designs. Design tools will divide into two paths. It feels like a restart of the 2016 competition: which tool lets designers express ideas quickest? Figma Make does not lead. It suits those committed to Figma, pulling from its styles, libraries, and unique props. It assumes the design file remains central.
Claude Design's Approach and Future Paths
Claude Design takes the opposing view. An Arts and Crafts idea called "truth to materials" holds that objects should reflect their true nature and construction, not pretend otherwise. Figma went the reverse way: strict rules hidden under a casual look. It acts like someone uptight trying to seem relaxed while obsessing over frames, tokens, and grids. Claude Design admits its base: pure HTML and JS. A 1902 Gustav Stickley lamp table shows exposed joinery and plain wood as an example. Claude Design links closely with Claude Code. Users can import repos during onboarding. Design and code feedback loops, long a pain point, merge into one process.
Stay ahead of the AI curve
The most important updates, news, and content — delivered weekly.
No spam. Unsubscribe anytime.
Another tool will ignore code entirely. It offers free play: place rectangles, layer styles, adjust blends and gradients without limits. Perhaps an iPad app with Pencil for quick sketches. 37signals might create something bold. Or it could resemble Photoshop, focused on detailed compositing, free from CSS limits. Figma mainly offered drop shadows or blurs for most of its history, which seems odd now.
Figma nears its Sketch moment, a phrase that would shock a Victorian child.
Direct Messages to Design Teams
Postscript for Sketch and Figma teams only.
To Figma: This post might circulate in your internal Slack. If reading from Figma, hiring me last year during interviews would have prevented it. Your choice.
To Sketch: Wake up and fight hard. Add particle effects, debossing, mesh transforms, metal shaders. Go wild. Drop the Mac-only ease and compete fiercely. Stop the complacency.
To mom: Apologies for the language.
Post-postscript: @jonnyburch on Twitter linked a blog post with aligned ideas, worth a read for more depth.

