snow-uiProhome

Installation

Pro items are copied into your project as source code by the shadcn CLI, from a private registry that checks your licence key.

Requirements

  • A project with React 19, TypeScript and Tailwind CSS v4: a new Next.js app (npx create-next-app@latest sets up Tailwind) or a Vite app set up for shadcn/ui (Tailwind and the @ import alias, see React Router). Templates and blocks work with any router; the guides show the Next.js App Router and React Router.
  • A current Node.js LTS release, to run the shadcn CLI with npx (or pnpm dlx, bunx).
  • The free snow-ui components set up in the project (step 1).
  • Your licence key, from the email you get after buying: it starts with snowpro_.

1. Set up snow-ui

Pro is built on snow-ui, the free MIT-licensed library: Pro items use its components, theme and tokens. In a new project, initialise with the snow-ui base:

Terminal
npx shadcn@latest init https://snow-ui.holakirr.com/r/snow-ui.json

Then remove the starter styles your app template put in its global stylesheet (a body font, --background / --foreground and their @theme inline colours): they override the snow-ui theme, dark mode included.

In an existing project, add the @snow-ui registry and the theme as the snow-ui registry guide describes. Keep a Radix UI style (radix-*), cssVariables: true, no Tailwind prefix and rtl: false in components.json: the components already handle right-to-left text.

2. Add the Pro registry

List both registries in components.json. The Pro one sends your key in an Authorization header, which the CLI sends only to that registry:

components.json
{
  "registries": {
    "@snow-ui": "https://snow-ui.holakirr.com/r/{name}.json",
    "@snow-ui-pro": {
      "url": "https://pro.snow-ui.holakirr.com/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${SNOW_UI_PRO_TOKEN}"
      }
    }
  }
}

${SNOW_UI_PRO_TOKEN} is read from your environment, or from .env or .env.local in the project.

3. Add your licence key

.env.local
SNOW_UI_PRO_TOKEN=snowpro_your_licence_key

Check that .env.local is in .gitignore (it is in new Next.js projects): the key is personal to your licence. Licence keys covers teams, CI and lost keys.

4. Add a template or block

Terminal
npx shadcn@latest add @snow-ui-pro/<name>
# A whole template, e.g. Auth & onboarding, and its mock backend:
npx shadcn@latest add @snow-ui-pro/auth @snow-ui-pro/mock-auth

The CLI then:

  1. downloads the item from the Pro registry with your key;
  2. writes its files under components/snow-ui-pro/, in the same layout as the source;
  3. installs the Pro items it is built from, the snow-ui components it uses (from the public registry) and any npm packages it needs.

To browse the catalogue or read an item before adding it:

Terminal
npx shadcn@latest search @snow-ui-pro
npx shadcn@latest view @snow-ui-pro/<name>

If your project already has snow-ui components from an older release, the CLI keeps your copies (“Skipped … files”) and a Pro item may not compile against them: add the item again with --overwrite, after committing, to update them too.

Next: the template guides (mounting the pages) and using templates and blocks. If the CLI answers with an error, see troubleshooting.