Zenix Logo
Zenix

Command Palette

Search for a command to run...

Docs
Next.js

Next.js

Install and configure Zenix UI for Next.js.

Create your Next.js project

If you don't have a Next.js project yet, create one:

Install Zenix UI

Add Zenix UI to your project using pnpm:

pnpm add zenix-ui

Configure your project

Follow the Zenix documentation to set up Tailwind CSS, theming, and any required configuration for your components.

Import and use a component

import { Button } from "zenix-ui";
 
export default function Home() {
  return (
    <div>
      <Button>Click me</Button>
    </div>
  );
}

Built by Mohd Safwan Uddin and the Zenix Team. GitHub

The command above will add the Button component to your project. You can then import it like this:

import { Button } from "@/components/ui/button";
 
export default function Home() {
  return (
    <div>
      <Button>Click me</Button>
    </div>
  );
}
IntroductionVite