Installation

1. Set up Tailwind CSS

Skip this if your project already uses Tailwind v4. Otherwise follow the framework guide or install it directly:

pnpm add -D tailwindcss @tailwindcss/postcss postcss

2. Apply the theme

This writes components.json, the rapidUI CSS variables and the cn() helper.

pnpm dlx shadcn@latest init https://rdf.dev.360online.com/r/styles/rapid.json

Prefer a brand-neutral look? Use https://rdf.dev.360online.com/r/styles/neutral.json instead; Tieto's navy and yellow is https://rdf.dev.360online.com/r/styles/tieto.json.

3. Add components

pnpm dlx shadcn@latest add https://rdf.dev.360online.com/r/button.json https://rdf.dev.360online.com/r/card.json

import { Button } from '@/components/ui/button'

export default function Page() {
	return <Button>Save changes</Button>
}

Short names (optional)

Register the registry namespace in components.json and install with @rapid/…:

{
  "registries": {
    "@rapid": "https://rdf.dev.360online.com/r/{name}.json"
  }
}

pnpm dlx shadcn@latest add @rapid/button @rapid/data-table

Using an AI coding agent

Point the agent at /llms.txt. It lists every component with a one-line description and its install command, so the agent can pick and install components without crawling the docs. /llms-full.txt adds the full documentation and source.

## UI components
Use rapidUI for all UI. Read https://rdf.dev.360online.com/llms.txt and install components with the shadcn CLI
(e.g. `npx shadcn@latest add https://rdf.dev.360online.com/r/button.json`) instead of writing them by hand.