Skip to main content
talos design:create builds a front-end design system as a module in your project. It scaffolds a base module, takes it out of the backend wiring, marks it as a design module, then clones the upstream skeleton-design repository and copies its source (components, hooks, icons, fonts, styles, and utils) into your module. The result is a design system under modules/<name>/src/, ready to use, with its dependencies already installed. A design module is not part of your backend. It is a self-contained UI layer that your SPA and other front-end code consume. For how it fits into the project, see the Design System overview.

​
Command

The name is normalized to PascalCase with any trailing Module stripped, and the folder on disk uses kebab-case. If you omit --name, the command prompts for it.

​
Examples

​
Options

​
What happens

When you run the command, it works through these steps in order:
  1. Scaffolds a base module under modules/<kebab-name>/: package.json (named @module/<kebab>), tsconfig.json, <kebab>.yml, and the usual module files.
  2. Un-registers it from AppModule and SharedModule. A design module is a front-end layer, not part of the backend, so it is removed from the backend module wiring.
  3. Removes the scaffolded <Pascal>Module.ts and its spec file, since a design module does not need a backend module class.
  4. Marks the module as type: "design" in its <kebab>.yml config so the toolchain treats it as a design system.
  5. Clones the upstream skeleton-design repository (https://github.com/ooneex/skeleton-design.git, a shallow clone) and copies its src/ into the module’s src/.
  6. Installs the design’s dependencies into your project: dependencies via bun add and devDependencies via bun add -D.
This command clones the design source over the network, so it needs git installed and an active internet connection.

​
What you get

After the command finishes, you have a complete design system under modules/<name>/src/, holding components, hooks, icons, fonts, styles, and utils, with every dependency already installed. To take a design module back out of your project, see Remove.

​
Use with Claude and Codex

The toolchain ships a matching talos:design skill. It guides your AI agent around the design system layout (where components, hooks, icons, fonts, styles, and utils live) so the agent can create the module and then work inside it correctly. Initialize the skills once for your agent:
Then ask Claude in natural language, and it maps the request to the command and runs it:
Prompt
For example, the prompt above maps to talos design:create --name=ui, then the agent can navigate the resulting design system using the talos:design skill. See design:create for the full command reference.