Installation

Install Tailwind CSS

Components are styled using Tailwind CSS v4. Follow the official installation guide to add it to your project.
If you are using React with Vite (TS), you can follow this vite TS guide and for React (JS) follow this vite JS guide.

Install Motion

Components are animated using Motion check the required dependencies first.

npm install motion

Add the utility helper

Create a lib/utils.ts file to manage Tailwind CSS classes:

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

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

Install icons

Add Lucide React icons:

npm install lucide-react

That's it

You can now start adding components to your project.

npx shadcn@latest add "https://aetherui.in/c/button.json"

The command above will add the Button component to your project. You can then import it anywhere in your project.

There is also option to add components manually via copying from the Component Page.