Installation · private GitHub registry
Install Default
Choose the source you need. Native shadcn installs its prerequisites automatically. The installed code belongs to your project.
Components are installed with the official shadcn CLI from the private GitHub repository nanonoir/miscellaneous-ui, using your own GitHub sign-in. Over this GitHub channel (shadcn CLI 4.21.1, pnpm, Chromium), a single item and the full catalog of each of the four collections were installed and built in three consumers (Next.js root, Next.js src with custom aliases and relocated CSS, Vite with custom aliases and relocated CSS), and a Button and a Dialog were rendered in each. These checks cover representative items and install pairs only, not every item, browser, package manager or project setup; access with a credential that lacks repository permission and the deployed showcase were not verified. The Registry freshness and schema workflow has since passed on GitHub Actions (Ubuntu, Node.js 24); that does not verify deployment protection. The collection notes below that mention a local HTTP registry describe earlier, separate checks.
1. Prepare your project
Requirements: React 19, TypeScript, Tailwind CSS 4 and configured shadcn. Supported: Next.js 16 and React with Vite.
GitHub access: install the GitHub CLI and sign in once with gh auth login. Your GitHub account must have read access to nanonoir/miscellaneous-ui: the CLI reads the repository with your credentials, and read access covers the whole repository and its history. Check the sign-in with gh auth status. No token belongs in components.json, in source or in a command.
No registry setup: the commands below use full nanonoir/miscellaneous-ui/<item> addresses. There is nothing to register and no server to start.
New project: create your Next.js or React/Vite application with the structure and package manager you prefer, then follow the official shadcn setup for Next.js or Vite.
Existing project: if shadcn is already configured, continue below. Otherwise, review the appropriate setup guide before changing existing files. Do not force reinitialization over your customizations.
Your components.json determines file destinations, aliases and the global stylesheet. Projects with or without src/ and custom destinations are supported; TypeScript and bundler aliases must agree. Monorepos and older React/Tailwind versions are not certified.
2. Choose what to install
Choose Default setup, individual items or the full 24-component catalog, including the advanced viewport components. Additional patterns are separate choices. Shared capabilities are independent of the UI catalog.
Install command
Dependencies and required styles are included automatically. Run the command in your consumer project after signing in with gh auth login (see the preparation step).
Choose at least one item to generate an add command.
3. Use and customize
Import examples use common aliases. Substitute the aliases from your components.json; your project does not need these exact folders.