daisyui-install

name	daisyui-install
description	Installation notes for daisyUI 5

daisyUI 5 install notes

install guide

1. daisyUI 5 requires Tailwind CSS 4
2. tailwind.config.js file is deprecated in Tailwind CSS v4. Do not use tailwind.config.js. Tailwind CSS v4 only needs @import "tailwindcss"; in the CSS file if it's a node dependency.
3. daisyUI 5 can be installed using npm i -D daisyui@latest and then adding @plugin "daisyui"; to the CSS file
4. daisyUI is suggested to be installed as a dependency but if you really want to use it from CDN, you can use Tailwind CSS and daisyUI CDN files:

<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>

5. A CSS file with Tailwind CSS and daisyUI looks like this (if it's a node dependency)

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

CDN

For a no-install browser setup, load the precompiled daisyUI CSS and Tailwind's browser build:

<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>

The main CDN file includes the light and dark themes. Load every built-in theme with:

<link href="https://cdn.jsdelivr.net/npm/daisyui@5/themes.css" rel="stylesheet" type="text/css" />

Individual daisyUI CSS modules can also be combined from the CDN. The is-drawer-open: and is-drawer-close: variants are not included in CDN files.

Standalone and framework-specific setup

• Use the standalone guide when using the Tailwind CSS standalone executable without Node.js.
• Otherwise select the guide that matches the existing framework or build tool: 11ty, Angular, Astro, Bun, Tailwind CLI, Dioxus, Django, Electron, Elysia, Ember, Fresh, HTMX, Laravel, Lit, Next.js, Nuxt, Phoenix, PostCSS, Preact, Qwik, Rails, React, React Router, Rsbuild, Solid, SolidStart, SvelteKit, UnoCSS, Vike, Vite, Vue, Waku, WordPress, Yew, or Zola.

Follow the selected guide's file paths and integration steps instead of assuming every framework uses the same CSS entry.