Claude Design Now Imports Your Design System and Syncs Directly with Claude Code

TL;DR: Claude Design's June 17 update adds /design-sync and /design to Claude Code — your mockups now use your actual component library, and the loop between prototype and production code is bi-directional.

Anthropic shipped a significant Claude Design overhaul on June 17. The headline for engineers: the design-to-code handoff is now a loop that stays inside the Claude ecosystem.

The two new Claude Code commands:

/design-sync imports a design system (from a GitHub repo, uploaded design file, or Figma export) into your Claude Code session. Once synced, Claude builds UI with your actual components — not generic MUI or Tailwind placeholders — and validates output against the design system before showing results. Enterprise admins can lock a single system so every engineer on the team builds from the same library.

/design goes the other direction: from Claude Code, run it to create or edit a visual prototype, import a design into a codebase, or convert existing code to a live prototype. The hand-off between design and engineering becomes bi-directional rather than a one-way spec dump.

Two practical workflows:

1. Design → Code: Import a Figma component library via /design-sync. Claude Code builds production components using your real design tokens and checks them against your system before you see results.
2. Code → Design: Run /design on an existing component to generate a visual version for design review; iterate in Claude Design; sync back.

Also in the June 17 update: a rebuilt canvas editor for drag/resize/align without full model regeneration (lower token burn); PDF and PowerPoint export; connectors for Vercel, Replit, Lovable, Miro, Adobe, and Canva.

Available in beta on Pro, Max, Team, and Enterprise at claude.ai/design or the Desktop sidebar.

Sources: Anthropic: Claude Design stays on brand for daily work, TechRepublic: Anthropic Adds Brand Controls, Code Sync to Claude Design, WinCentral: Claude Design Adds Real Editing and Claude Code Sync