Anthropic 大幅更新 Claude Design：支持设计系统导入与代码往返

Anthropic just rolled out a major Claude Design update, adding design system imports, code round-trips, and a fix for its heavy token usage issue.

The old version worked more like a smart visual generator: you described a webpage, slide, or app screen, and Claude created something polished, but the output came from Claude’s own taste rather than your company’s design system.

The new version changes the control layer, because Claude can now import design systems from repos, design files, or codebases, then build with the actual buttons, fonts, colors, spacing rules, and components your team already uses.

That means the model is no longer only generating a design; it is checking whether its own output matches the approved system before you see it.

This is a big deal for companies because brand consistency is usually boring, manual, and easy to break when many teams are making pages, decks, ads, and product screens at high speed.

The Claude Code sync is the other major shift, because design and engineering can now pass work back and forth through the same Claude environment instead of relying on screenshots, specs, or a developer rebuilding the mockup from scratch.

A designer can start with a visual design, hand it to Claude Code, and a developer can continue from the real component library, while a developer can also start in code and sync the design project back.

The canvas editor also super useful, because small changes like drag, resize, and align no longer need a full model regeneration, which should reduce wasted tokens and make the tool feel less like a demo and more like daily software.

Anthropic wants Claude Design to become the starting point for branded assets, product prototypes, and code-ready interfaces, then send that work into tools like Canva, Adobe, Vercel, Replit, PDF, and PowerPoint.