Install daisyUI for Next.js

How to install Tailwind CSS and daisyUI in a Next.js project

1. Create a new Next.js project

npx sv create

2. Install Tailwind CSS and daisyUI

npm install tailwindcss@next @tailwindcss/postcss@next daisyui@beta

3. Add Tailwind CSS and daisyUI

Add Tailwind CSS to your PostCSS config file

/** @type {import('postcss-load-config').Config} */
const config = {
  plugins: {
    '@tailwindcss/postcss': {},
  },
};
export default config;

Put Tailwind and daisyUI to your CSS file

@import "tailwindcss";
@plugin "daisyui";

Now you can use daisyUI class names!

Official daisyUI
Figma Library

Available on daisyUI store

More details