Installation

Get Kiwimi Lab running in your project in a few minutes.

Create a Next.js project

If you don't have a project yet, scaffold one with the App Router:

npx create-next-app@latest my-app --typescript --tailwind --app
cd my-app

Install dependencies

Kiwimi Lab components rely on a small set of peer dependencies:

npm install clsx tailwind-merge class-variance-authority lucide-react

Configure path aliases

Ensure your tsconfig.json includes:

{
  "compilerOptions": {
    "paths": {
      "@/*": ["./*"]
    }
  }
}

Add utility helper

Create lib/utils.ts:

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

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

Copy your first component

Browse the Components section and copy the source into your components/ui/ folder. Each component is self-contained and ready to customize.

Next steps

Continue to Quick Start to use your first component.