Regenerate in the Design Tool or Edit in Your Editor? The Decision Rule That Keeps Both From Fighting

If it's exploratory or spans components, go back to the design tool. If direction is settled and the change is local, stay in the editor.

The tension is real: Claude Design generates a fresh component tree on every export, so any change you made in code after the last export disappears on the next one. That makes "quick, I'll just tweak it in the tool" expensive — and "I'll just edit the code" increasingly wrong as soon as you need to explore a different layout direction.

Three questions that decide

1. Am I exploring directions, or executing one? Still deciding between layouts, color schemes, or component structures → go back to Design. Direction is settled and you're implementing → stay in code.

2. Does the change span more than one component? A nav + hero + card consistency fix has to be done in the design tool — doing it piecemeal in code invites drift. A spacing fix inside one existing component is a one-liner in code.

3. Will Claude Code know what "better" looks like? Visual aesthetics and gestalt are things Claude Design reasons about holistically. Functional correctness (prop types, responsive breakpoints, a11y attributes) is what Claude Code is better positioned to verify.

What's safe to edit directly in code (after handoff)

• Padding/margin/gap values within an existing component
• Prop types and TypeScript interfaces
• Responsive breakpoint tweaks (sm:, md: classes or MUI breakpoint objects)
• Animation timing and easing
• Accessibility attributes (aria-label, role, tabIndex)
• Integration-specific imports and wiring (useRouter, useSession, data hooks)

What you'll lose on every re-export (the stateless re-export problem)

Claude Design has no memory of your codebase — it regenerates from its own model of the design. Every re-export is a clean slate from the tool's perspective. That means:

• Post-handoff a11y fixes
• TypeScript types you added
• Integration-specific imports
• Any custom hooks you wired in

Recommendation: maintain a DIFF.md (or a short comment block at the top of re-exported files) listing the changes you made post-handoff. Before every re-export, check it; after every re-export, re-apply it.

The workflow that avoids the fight

1. Explore in Claude Design until direction is locked.
2. Export once. Record post-handoff changes in DIFF.md.
3. Iterate functionally in Claude Code from that point.
4. If you need to re-explore layout, go back to Design — but bring DIFF.md so you know what to re-apply.

Sources: Get started with Claude Design — support.claude.com · Claude Design handoff workflow — DEV Community · claudefa.st — community practitioner notes