LogoLogoLogoLogo
ComponentsBlocksTemplatesStarterDocs
Docs
  • Introduction
  • Installation
  • Changelog
    • Starter

    Installation

    PreviousNext

    Set up PaceUI in a new or existing shadcn project and start adding blocks.

    Create a shadcn project

    Start a new project with shadcn initialized, or set up shadcn in your existing project:

    npm
    yarn
    pnpm
    bun
    npx shadcn@latest init

    This works with Next.js, Vite, Remix, and other supported frameworks. See the shadcn docs for framework-specific guides.

    Choose your plan

    PaceUI offers free and premium blocks. Pick what works for you:

    PlanAccessPrice
    CommunityFree blocks and componentsFree
    BasicAll basic blocks, components, and templatesPricing
    ProEverything — all blocks, templates, and priority supportPricing

    Using free blocks? Skip to Step 4 — no account or token needed.

    Want premium access? Head to the pricing page and purchase a license.

    Set up your API Token (premium only)

    After purchasing a license, generate an API token from your Account → API Keys page.

    Then add the token to your project's environment:

    .env.local
    PACEUI_REGISTRY_TOKEN=pk_your_api_token_here

    How it works: The shadcn CLI automatically reads PACEUI_REGISTRY_TOKEN from your environment and includes it as a Bearer token when fetching from private registries. No extra configuration needed.

    Add the PaceUI registry

    Add the @paceui namespace to your components.json file:

    components.json
    {  ...  "registries": {      /* [!code ++:6] */      "@paceui": {          "url": "https://paceui.com/r/{name}.json",          "headers": {              "Authorization": "Bearer ${PACEUI_REGISTRY_TOKEN}"          }      }  }}

    Start adding blocks

    You're all set. Add any PaceUI block using the shadcn CLI:

    npm
    yarn
    pnpm
    bun
    npx shadcn@latest add @paceui/hero-section

    Then import and use it in your project:

    page.tsx
    import { HeroSection } from "@/components/paceui/hero-section";export default function Home() {  return (      <HeroSection />  )}

    Troubleshooting

    "Component requires an API key"

    This means the block you're trying to install is a premium block. Make sure:

    1. You have an active Basic or Pro license — check your plan
    2. Your PACEUI_REGISTRY_TOKEN is set in .env.local
    3. The token is valid — regenerate it from Account → API Keys if needed

    "Registry not found"

    Double-check that your components.json has the @paceui registry entry with the correct URL:

    "@paceui": "https://paceui.com/r/{name}.json"

    Using a monorepo?

    Set the PACEUI_REGISTRY_TOKEN in the .env.local of the package where you run the shadcn CLI, or export it in your shell:

    export PACEUI_REGISTRY_TOKEN=pk_your_api_token_here