Your next project,
on familiar ground.

01 / Install the package

Use React 19, Tailwind CSS 4, and a bundler such as Vite, Astro, Next.js, or TanStack Start. Install from the public npm registry:

pnpm add @raymondtju/ui

The npm package uses the personal scope @raymondtju. If your project uses a custom registry, set @raymondtju:registry=https://registry.npmjs.org/ in your project’s .npmrc. No npm login or package-read token is needed.

02 / Load the shared theme

Enable Tailwind’s framework integration. In the application’s global stylesheet:

@import "@raymondtju/ui/globals.css";
@source "../node_modules/@raymondtju/ui/dist";

The source path is relative to your stylesheet. For src/styles/globals.css, use ../../node_modules/@raymondtju/ui/dist. Tailwind ignores dependencies by default, so this scan path is required for packaged component classes.

The theme includes fonts, light/dark tokens, form controls, and motion styles. It does not lock the page’s height or scrolling.

03 / Import what you need

import { Button } from "@raymondtju/ui/components/button";
import { Input } from "@raymondtju/ui/components/input";

export function InviteForm() {
  return (
    <form>
      <Input aria-label="Email" type="email" />
      <Button type="submit">Send invitation</Button>
    </form>
  );
}

Components use individual entry points so consumers do not need to import an entire component collection. Add class="dark" to your document root to switch themes.

Or / Copy and own the source

The shadcn namespace stays @recrav, independently of the npm scope. Initialize shadcn in your React/Tailwind project, then merge this namespace into components.json:

{
  "registries": {
    "@recrav": "https://ui.recrav.com/r/{name}.json"
  }
}

The registry is public. Neither this command nor its nested dependencies need an Authorization header, secret, or login.

pnpm dlx shadcn@latest add @recrav/button

The registry installs dependent components and theme files automatically. Import the generated styles/recrav.css from your app’s global stylesheet. Adjust that relative path to your project.

Copied components become your project’s responsibility. Package consumers get updates when they upgrade the package version. Both options use the MIT license ; preserve copyright and license notices, including third-party notices .

Moving an existing Minton consumer

The entry-point structure stays the same, but the npm scope changes. Publish a release first, then replace Minton’s local @recrav/ui dependency with@raymondtju/uiin a separate migration. Update component, hook, utility, and CSS imports to the new prefix, including Tailwind scan paths. Existing copies in other products need a comparison before replacement.