Installation — logic2b/ui

Requirements

React 18+ (React 19 recommended)
Tailwind CSS v4

1. Install the base dependencies

pnpm add clsx tailwind-merge class-variance-authority radix-ui lucide-react

2. Add the cn() helper

Create src/lib/utils.ts:

import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}

Or install it from the registry:

npx logic2b@latest add utils

3. Add the theme tokens

Copy the CSS variables from the Theming page into your global CSS file. Components reference tokens like bg-primary and text-muted-foreground; without them nothing will look right.

4. Add components

npx logic2b@latest add button

Or copy the source from any component page — every page has a Code tab with the full source.

Path aliases

Components import from @/lib/utils and @/components/ui/*. Configure the @ alias in your tsconfig.json and bundler to point at src/.