Installation

How to install dependencies and structure your app.

shipbase/ui components are distributed through shadcn/ui’s registry system, so you can install them using the familiar shadcn CLI.

Already initialized with shadcn CLI

If your project has components.json configured (from running shadcn init previously), add the appropriate shipbase registry for your framework:

{
  "registries": {
    "@shipbase": "https://ui.shipbase.xyz/r/react/{name}.json"
  }
}

Then install components:

New project setup

If you haven’t initialized shadcn CLI yet, start with the standard setup:

1. Set up shadcn/ui

Follow the official shadcn/ui installation guide for your framework (Next.js, Vite, etc.) to properly initialize your project.

2. Add shipbase registry

After initialization, add the appropriate shipbase registry to your generated components.json:

{
  "registries": {
    "@shipbase": "https://ui.shipbase.xyz/r/react/{name}.json"
  }
}

3. Install components

Usage

Components work exactly like shadcn/ui components:

import { Button } from "@/components/ui/button"

export function MyComponent() {
  return <Button>Click me</Button>
}