Installation

Netter UI is a shadcn-compatible registry. Components are copied into your project as editable source, so you own every line.

Requirements

  • React 19 and a framework such as Next.js 15+ (App Router recommended).
  • Tailwind CSS v4 configured in the project.
  • Node.js 20 or newer to run the shadcn CLI.
  1. Initialize shadcn

    Run this once in a Next.js (App Router) or other React project that already uses Tailwind CSS v4. It creates components.json, the cn helper and the CSS variables the CLI expects. Skip it if your project already has a components.json.

    npmnpx shadcn@latest init
  2. Register the @netter namespace

    A one-time setup per project. It adds the Netter registry to components.json so every item can be installed by name.

    npmnpx shadcn@latest registry add @netter=https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/{name}.json
  3. Add a component

    Install any item by its slug. The source is copied into components/netter and its npm dependencies are installed for you.

    npmnpx shadcn@latest add @netter/otp-input
  4. Or install from a direct URL

    No namespace needed: point the CLI straight at the item JSON. Every component page lists this command for each package manager.

    npmnpx shadcn@latest add https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/otp-input.json
    pnpmpnpm dlx shadcn@latest add https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/otp-input.json
    bunbunx shadcn@latest add https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/otp-input.json
    yarnyarn dlx shadcn@latest add https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/otp-input.json
  5. Search and inspect from the terminal

    With the namespace registered you can list items and preview an item's files and dependencies before adding it.

    searchnpx shadcn@latest search @netter -q "otp"
    viewnpx shadcn@latest view @netter/otp-input

Registry endpoints

Catalog
https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/registry.json
Item template
https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/{name}.json
Example item
https://netter-ui-app-la9g10-924acb-161-153-45-177.sslip.io/r/otp-input.json
Browse components