daisyUI
version 1.25.4
Change Theme
  • 🌝  light
  • 🌚  dark
  • 🧁  cupcake
  • 🐝  bumblebee
  • ✳️  Emerald
  • 🏢  Corporate
  • 🌃  synthwave
  • 👴  retro
  • 🤖  cyberpunk
  • 🌸  valentine
  • 🎃  halloween
  • 🌷  garden
  • 🌲  forest
  • 🐟  aqua
  • 👓  lofi
  • 🖍  pastel
  • 🧚‍♀️  fantasy
  • 📝  Wireframe
  • 🏴  black
  • 💎  luxury
  • 🧛‍♂️  dracula
  • 🖨  CMYK
Tailwind Plugin Use CDN WindiCSS Tachyons BassCSS More examples on github

Install as Tailwind CSS plugin

You need Node.js and Tailwind CSS installed.

1. Install daisyUI:

npm i daisyui

2. Then add daisyUI to your tailwind.config.js

module.exports = {

    plugins: [
      require('daisyui'),
    ],

  }
Next: How to use
daisyUI
version 1.25.4
  • Docs
  • install
  • use
  • customize components
  • Themes
  • config
  • Colors
  • Layout & Typography
  • Components
  • alert
  • artboard
  • avatar
  • badge
  • breadcrumbs
  • button
  • button-group
  • card
  • carousel
  • collapse
  • countdown
  • divider
  • drawer
  • dropdown
  • footer
  • hero
  • indicator new
  • kbd
  • link
  • mask
  • menu
  • modal
  • navbar
  • pagination
  • progress
  • rating
  • stack new
  • stat
  • steps updated
  • tab
  • table
  • tooltip
  • form-checkbox
  • form-input updated
  • form-radio
  • form-range
  • form-select
  • form-textarea
  • form-toggle
  • mockup-code
  • mockup-phone
  • mockup-window
  • Demos
  • cards
  • mobile-screen
  • style-guide