CLI

Use the Olyx CLI to initialize a project and add UI components.

The Olyx CLI ships as the olyx command.

  • Initialize a project: olyx init
  • Add components: olyx add button card dialog- List components: olyx list If you don’t have it installed globally, you can run it with npx:

init

Use init to set up Olyx UI in the current folder.

What init does:

  • Creates (or confirms) your component install directory (default: src/components/ui)
  • Writes components.json with your chosen componentDir
  • Installs the base style files (tokens.css and colors.css) into your component directory
  • Tries to inject @import statements into your global CSS file (when it can detect it)
olyx init

Help

Usage: olyx init [options]
 
Initialize Olyx UI in your project
 
Options:
  -h, --help  display help for command

Notes:

  • If you run olyx init in an empty folder (no package.json), it offers to scaffold a new project (Next.js, Vite, or TanStack Start) and then continues setup inside the created directory.
  • If global CSS injection can’t be done automatically, the CLI prints the exact @import lines you need to paste into your global stylesheet.

add

Use add to install one or more components from the registry into your project.

olyx add button

You can add multiple components at once:

olyx add button card dialog

If you run add without component names, it opens an interactive picker:

olyx add

What add does:

  • Ensures your project is initialized (creates components.json automatically if missing)
  • Fetches the component registry and resolves registry dependencies
  • Writes component files into your configured componentDir
  • Detects your package manager (bun/pnpm/yarn/npm) and installs any required npm dependencies
  • Prompts before overwriting existing components

Help

Usage: olyx add [options] [components...]
 
Add components to your project
 
Arguments:
  components  Components to add
 
Options:
  -h, --help  display help for command

list

Use list to display all available components from the registry.

olyx list

Or with npx:

What list does:

  • Fetches the component registry
  • Displays all available UI components in alphabetical order

Help

Usage: olyx list [options]
 
List all available components
 
Options:
  -h, --help  display help for command

How the registry is used

Olyx is registry-driven: components are defined in a registry, and the CLI installs files + npm dependencies based on those registry entries.

In this monorepo, the CLI currently reads the local registry file and component sources:

  • apps/web/registry.json
  • packages/react/src