On June 18, Anthropic announced a large-scale redesign of Claude Design. Key highlights include support for importing design systems from GitHub repositories, design files, or original assets; bidirectional integration with Claude Code; and a two-layer improvement plan targeting the Token consumption problem. It also expands 9 export partners, including Adobe, Base44, and others.
Design System Import: Import from GitHub Repositories and Lock in Brand Standards
The core update in this redesign is a rebuilt design system import feature. Users can now upload a design system from GitHub repositories, design files, or original assets. After import, Claude creates based on these components, and before output it automatically compares against the design system specifications for corrections, so users won’t see the version before the fixes.
The new admin role can approve a single standard design system and lock editing permissions to ensure that every asset produced by Claude complies with the company’s brand standards. The difference from the first version lies in the essence: Claude Design in the initial release is more like a blank canvas—its output reflects Claude’s aesthetic judgment—whereas after the update it can produce outputs according to brand standards, making it suitable for large enterprises with strict brand guideline manuals.
Bidirectional Integration with Claude Code: Functional Explanation of /design-sync and /design Commands
The bidirectional integration between Claude Design and Claude Code is the second major update:
· In Claude Code, enter the /design-sync command to import the design system from your local codebase into Claude Design. After completing the design, one-click handoff to Claude Code begins the development phase, without needing screenshots or rebuilding.
· For the reverse operation, in the Claude Code terminal, enter the /design command and developers can directly create, edit, and sync design projects without leaving their workflow.
The article notes that handoff between design and engineering is one of the most stubborn friction points in software development for decades. Tools such as Figma Dev Mode and Zeplin attempt to narrow the gap by generating specifications and code snippets from design files, but the translation process always introduces loss. Anthropic’s bet is this: if the same AI system handles both design and code at the same time and shares the same component library, the gap can be eliminated.
Two-Layer Plan to Improve Token Consumption
Anthropic’s Token consumption improvement is split into two layers:
Shared usage pool: Claude Design’s usage limits are now shared with conversations, Claude Cowork, and Claude Code, rather than being charged from separate smaller pools, giving most users more buffer space.
Boost generation efficiency per run: Anthropic claims it has reduced the average Token consumption per generation while maintaining output quality. A new editor allows users to directly drag, adjust, and align individual elements, without consuming model inference for every small tweak; and hundreds of stability fixes also reduce Token waste from errors and re-generation.
The article also points out that a structural contradiction still remains: generative design requires Claude to simultaneously reason about layout, typography, colors, spacing, responsiveness, and content, and to produce a complete, usable artifact—far heavier than Q&A-style dialogue. The impact is smaller for high-usage customers on Team and Enterprise plans, but this issue still exists for Pro subscribers.
FAQ
For what types of users is the design system import feature most valuable?
According to the article, design system import is most strategically meaningful for large enterprises—these organizations have strict brand guideline manuals and need to ensure that every Claude output matches the company’s visual standards. The initial “blank canvas” positioning of Claude Design is enough for individuals or startups, but it cannot be adopted by large enterprises with 200 pages of brand guidelines.
Does the bidirectional integration with Claude Code require an additional subscription?
The article does not disclose whether an additional subscription is required. It only explains that the integration is achieved via the /design-sync and /design commands. Specific pricing and subscription requirements should be referenced in Anthropic’s official announcements.
Among the 9 export partners, what role does Claude Design play in the workflow?
According to the article and statements from the partners, Claude Design is positioned as a “creative hub” rather than an endpoint—it's the starting point of the design workflow. Partners such as Adobe, Canva, and Vercel handle subsequent refinement, collaboration, and deployment. Replit CEO Michele Catasta describes it as “catching builders at the moment creativity sparks,” while Vercel’s Andrew Qu talks about “pushing concepts directly to Vercel for launch.”
