The stage

Design system

Now

Every project has exactly one design system — the "taste" layer that keeps generated screens coherent instead of a pile of one-off styles.

Three sources

  • Extracted from your repo (read-only) — pulled from your bound workspace's Tailwind config, CSS variables, or tokens.json.
  • Catalog — picked from Iterel's preloaded set.
  • Iterel Base — the default, for greenfield projects.

The design pack

Underneath is a "design pack": Iterel's generation guardrails plus your project's design system, distilled into engine-facing guidance injected into every design-touching task. It teaches the engine — Claude Code, Codex — to design with your taste, not generic defaults.

Greenfield scaffold

On a fresh project, the first design task scaffolds the design system into the codebase as real code (tokens, base components), so your product ships with a system rather than inheriting one only at generation time. Component-level authoring, a DS-editing UI, and Figma import are on the roadmap.