radkradk

components.json

Configuration for your project.

The components.json file holds configuration for your project. It tells the CLI where to install components, how to resolve imports, and which style to use.

Creating components.json

Run npx radk init to create the file automatically, or create it manually:

components.json
{
  "$schema": "https://radk.dev/schema.json",
  "style": "radk",
  "rsc": true,
  "tsx": true,
  "tailwind": {
    "css": "app/globals.css",
    "baseColor": "slate-blue",
    "cssVariables": true
  },
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils",
    "ui": "@/components/ui",
    "lib": "@/lib",
    "hooks": "@/hooks"
  },
  "registryUrl": "https://radk.dev/r"
}

Fields

style

The component style to use. Currently only "radk" is supported.

{
  "style": "radk"
}

rsc

Whether your project uses React Server Components. Defaults to true.

{
  "rsc": true
}

tsx

Use TypeScript (.tsx) files. Set to false for JavaScript (.jsx). Defaults to true.

{
  "tsx": true
}

tailwind.css

Path to your global CSS file relative to the project root.

{
  "tailwind": {
    "css": "app/globals.css"
  }
}

tailwind.cssVariables

Use CSS variables for colors. Set to false to use Tailwind utility classes directly. Defaults to true.

{
  "tailwind": {
    "cssVariables": true
  }
}

aliases

Path aliases for your project. Must match your tsconfig.json paths.

{
  "aliases": {
    "components": "@/components",
    "utils": "@/lib/utils",
    "ui": "@/components/ui",
    "lib": "@/lib",
    "hooks": "@/hooks"
  }
}

registryUrl

The registry URL to fetch components from. Defaults to https://radk.dev/r.

{
  "registryUrl": "https://radk.dev/r"
}