Create design systems from your project’s code

From code analyzes the project you have open using your existing Codex or Claude connection. It can identify more than one design system when the repository contains distinct products or platforms.

Analyze and select

1. Open Design → Design systems and choose From code.

2. Let the Agent inspect the project’s apps, shared components, themes, and local font declarations. Answer any clarification about which products or styles belong together.

3. Review the proposed systems, their descriptions, recovered tokens, and supporting source files.

4. Select the systems you want and choose Create draft or Create N drafts.

5. Open each created draft and inspect its specimen and source notes.

6. Use Review changes and Apply system before selecting it for a Studio design.

When the project has several styles

Apps that share one visual foundation should stay together. Distinct products can become separate systems. Light/dark themes and responsive variants are not automatically separate systems. Clarify the intended boundaries with the Agent if the proposal groups them incorrectly.

Your existing work stays intact

Analysis reads project code; it does not change the application or apply a system. Existing systems are identified for opening rather than overwritten. The resulting systems remain drafts until you review and apply them.

If a cited source changes before draft creation, run New analysis and review the fresh results. If no UI is found, the Agent can explain that instead of creating an empty system. The latest analysis and already-created drafts remain available when you return.