The Gap Between Claude Design and Your Codebase: When to Regenerate and When to Fix in the Editor

After Claude Code implements your Claude Design artifact, the result drifts from the spec in two distinct ways. Use one rule to decide: structural problems go back to Claude Design; presentational problems get fixed in the editor.

Claude Code reads the design artifact — component specs, tokens, layout intent — and generates implementation code. Most of the time it's close. When it isn't, the drift falls into one of two categories.

Structural drift: The layout hierarchy is wrong. A sidebar renders inline. A card grid collapses to a single column. A shared sub-component is inlined where it should be extracted. These problems exist because the implementation missed the structure of the design intent, not its surface values. Fix: go back to Claude Design. Annotate the structural intent more precisely in the artifact (label layout containers, name component boundaries explicitly), then regenerate. Trying to patch structural drift in the editor turns into a long sequence of changes that leaves your code diverged from the design spec — and the next regeneration overwrites them anyway.

Presentational drift: The right components are in the right places but values are off. Padding is 16px where the spec says 24px. The primary button renders with the wrong background token. Font weight reads 700 where the design says 600. Fix: patch in the editor. These are implementation errors, not design errors — Claude Code pulled the wrong token or misread a spacing value. Fix them directly and push. Don't round-trip through the design tool for a padding value.

The practical rule:

If you can describe the problem in one sentence containing where something is or what a component is, go back to the design. If the sentence contains only what value something has, fix it in the editor.

One limit to be aware of: Claude Design currently regenerates an entire component — there's no way to regenerate just the layout container while preserving the rest. When you go back to fix structural drift, you'll lose any presentational values you've already tuned in the editor. Note them (screenshot or a quick comment) before regenerating, and apply them after. This is the main reason to do structural and presentational fixes in the right order: structure first, presentation last.

Sources: Claude Design — support.claude.com · From Prompt to Pull Request: Claude Design + Claude Code — DEV Community · Anthropic overhauled Claude Design to fix the handoff — The New Stack