Command Line Interface

Add component source to your project, browse the catalog, and install from the public registry directly from your terminal.

Quick Installation via CLI

DevClub UI components can be installed directly into your local codebase using either the dedicated package runner or the universal shadcn CLI:

Official Package CLIRecommended

Terminal

npx @devclubnst/ui add noise

Universal Shadcn RegistryRemote JSON

Terminal

npx shadcn@latest add https://ui.devclubxnst.online/r/noise.json

Discover Components

List the available components, view CLI help, add several components in one command, or replace a component you already added with --overwrite.

Terminal

npx @devclubnst/ui@latest list

npx @devclubnst/ui@latest --help

npx @devclubnst/ui add noise orb

npx @devclubnst/ui add noise --overwrite

Component File Structure

The CLI uses an @/-based aliases.ui path from components.json when available. Otherwise, it selects src/components/ui or components/ui based on your project structure. Files that already exist are skipped; pass --overwrite to replace them. The cn() helper in lib/utils.ts must exist before you add components: run npx shadcn@latest init or follow the Project setup step in Installation.

Project Tree

src/

├── components/

│ └── ui/

│ ├── dotted-accordion.tsx

│ ├── ai-orb.tsx

│ ├── proximity-sidebar.tsx

│ └── noise.tsx

└── lib/

└── utils.ts

Zero Lock-In

Once a component is placed into your directory, it contains zero references to external runtime servers. It is 100% self-contained TypeScript and Tailwind CSS code under your git version control.