CLI

Initialize shadcn/ui

From your Next.js app root, run the initializer. It writes components.json, wires CSS variables, and installs shared UI dependencies.

npx shadcn@latest init

Choose a style and base color that match your brand; you can always tune tokens later in globals.css.

Add components

npx shadcn@latest add button
npx shadcn@latest add dialog tabs

Add only what you need. Nexus-UI marketing and library views compose many primitives from this baseline.

Monorepos

Target a workspace package with the working directory flag:

npx shadcn@latest init -c ./apps/web
npx shadcn@latest add card -c ./apps/web

@nexus-labs registry (shadcn add)

You do not need a public host to try this. Next.js serves files from public/r/, so with Nexus-UI running locally (npm run dev, default port 3000) the registry is already at http://127.0.0.1:3000/r/terminal.json (one JSON per component). In the project where you want the component, point components.json at that URL (change the port if your dev server uses something other than 3000):

"registries": {
  "@nexus-labs": "http://127.0.0.1:3000/r/{name}.json"
}

Keep Nexus-UI's dev server running while you run the add command in the other app. Initialize shadcn there if needed (npx shadcn@latest init), then:

npx shadcn@latest add @nexus-labs/terminal
npx shadcn@latest add @nexus-labs/gooey-input

The CLI installs declared dependencies (for example framer-motion), pulls utils from the default shadcn registry if needed, and writes files under your components alias. Registries are built from scripts/build-registry.mjs — run npm run registry:build (also runs before npm run build).

When you eventually deploy Nexus-UI (e.g. Vercel), set NEXT_PUBLIC_SITE_URL to your production origin and change the registry URL in consumer apps to https://your-domain/r/{name}.json so installs work without a local server.

Nexus-UI catalog workflow

Every catalog slug has a matching public/r/<name>.json entry. You can still open the Code tab on any component page to copy React or Tailwind directly. Keep motion boundaries in "use client" modules when you use Framer Motion.

Terminal component + sprite audio

The Terminal demo uses an OGG sprite for keyboard sound effects. Place sound.ogg under public/sounds/ next to sprite-config.json, or run npm run sounds:fetch. See public/sounds/README.md for download URLs and copy instructions.