Docs

Install

Patina is a namespaced shadcn registry. Add it to components.json, then add items.

pnpm add motion
npx shadcn@latest add @patina/marquee
npx shadcn@latest add @patina/dock

Tokens

Surfaces use CSS variables only — --background, --foreground, --brass. Dark is the default. Light mode remaps the same names. Do not hardcode surface hex.

Fonts: Geist for UI, Instrument Serif for headings via --font-heading.

Registry auth

@patina is public. @patina-pro returns 401 unless you send X-License-Key.

{
  "registries": {
    "@patina": "https://patina-ui.pages.dev/r/{name}.json",
    "@patina-pro": {
      "url": "https://patina-ui.pages.dev/r/{name}.json",
      "headers": {
        "X-License-Key": "${PATINA_LICENSE_KEY}"
      }
    }
  }
}

License

Pro is $49 once. Checkout writes plan=pro and issues a pat_live_… key. See /license. 14-day refund.

Reduced motion

Every animated component reads prefers-reduced-motion. Global CSS also short-circuits animation duration. Marquee becomes a static row. Dock stops magnifying.