0.26.0

DaisyUI
Tailwind CSS
Components 

npm i daisyui --save
Clean HTML with component classes
Customizable and themeable
Pure CSS, No dependencies
Get started   components
Tab one Tab two Tab three

Clean HTML

with component classes

Your HTML doesn't need to be messy. DaisyUI adds component classes to Tailwind CSS. Classes like btn, card, etc... No need to deal with hundreds of utility classes. 

<a class="inline-block px-4 py-3
    text-sm font-semibold text-center
    text-white uppercase transition
    duration-200 ease-in-out bg-indigo-500
    rounded-md cursor-pointer
    hover:bg-indigo-600">Button</a>
VS
<a class="btn btn-primary">Button</a>

Highly customizable

using Tailwind's utility classes

DaisyUI is based on Tailwind's utility classes and all components have low specificity so you can customize everything using utility classes.
You can even use @apply to add your custom styles to components or you can change colors and other design decisions using CSS variables. 

<a class="btn btn-primary">Button</a>
↓ 
<a class="btn btn-primary rounded-full">Button</a>

Powerful theming

Apply your own design decisions

DaisyUI adds a set of semantic color names to Tailwind. So instead of using generic color names like bg-blue-500, we can use semantic role names like bg-primary or bg-success.
All colors are CSS variables so you easily add dark mode by changing a few CSS variables. Try DaisyUI default themes or create your own theme in less than a minute!

Luxury Theme

Cupcake Theme

Cyberpunk Theme

Read more about themes

Try it online

Use DaisyUI file from CDN (Tailwind CSS default style included) 

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

Or try it online:

Codepen Tailwind Play

Install DaisyUI

No dependencies, pure CSS. Can be used as a Tailwind CSS plugin or as an independent CSS library

1. Install DaisyUI as a Node package: 

npm i daisyui --save

2. Use DaisyUI as a Tailwind CSS plugin recommended

// tailwind.config.js
  module.exports = {
    plugins: [
      require('daisyui'),
    ],
  }

Or import the CSS file and use it only as a component library: 

import 'daisyui/dist/styled.css';
Install guide