Skip to main content
ooneex 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 into your module — components, hooks, icons, fonts, styles, and utils. The result is a ready-to-use design system under modules/<name>/src/ 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. See the Design System overview for how it fits into the project.

​
Command

ooneex design:create [options]
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

# Interactive: prompts for the design module name
ooneex design:create

# Provide the name up front
ooneex design:create --name=ui

​
Options

OptionDescriptionDefault
--nameName of the design module to create.Prompted if omitted
--cwdWorking directory the command runs in.Current directory
--silentSkip prompts and log output.false

​
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 — 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/ — 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 ooneex: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: 
ooneex claude:init
Then ask Claude in natural language — it maps the request to the command and runs it:
Prompt
Create a design module called ui.
For example, the prompt above maps to ooneex design:create --name=ui, then the agent can navigate the resulting design system using the ooneex:design skill. See design:create for the full command reference.