Manual Installation

Install Tailwind CSS

Ensure your project has Tailwind CSS installed and configured.

Initialize Tailgrids

Run the command in the CLI to initialize Tailgrids in your project:

npx @tailgrids/cli@latest init

Follow the prompts to configure your project structure and path aliases.

Note: If you have chosen not to replace the content of your main CSS file, you will need to copy and paste the styles of tailgrids.css into your main CSS file (e.g., src/app/globals.css or src/index.css).

Add Components

Use the CLI to add components to your project:

npx @tailgrids/cli@latest add button

Use the Component

Import and use the component in your application:

import { Button } from "@/components/tailgrids/core/button";

export default function Example() {
  return <Button>Click me</Button>;
}

Note: You may need to update the import path based on your project structure.