daisyui

Installation
Summary

Tailwind CSS component library with 50+ semantic components, 30+ themes, and built-in dark mode.

  • Provides semantic class names (btn, card, modal) instead of utility-only Tailwind, reducing markup verbosity and improving maintainability
  • Includes 30+ pre-built themes plus custom theme support, with automatic dark mode detection and localStorage persistence
  • Framework-agnostic: works with React, Vue, Svelte, or vanilla HTML without additional dependencies
  • Covers navigation, forms, data display, feedback, and layout components with responsive variants, multiple sizes, and state modifiers (active, disabled, loading)
SKILL.md

DaisyUI Component Library

Summary

DaisyUI is the most popular Tailwind CSS component library providing semantic class names for 50+ components with built-in themes, dark mode, and customization. Framework-agnostic and production-ready.

When to Use

  • Building UI with Tailwind CSS and need pre-styled components
  • Want semantic class names (btn, card) instead of utility-only approach
  • Need built-in theming system with 30+ themes and dark mode
  • Require consistent design system across React, Vue, Svelte, or vanilla HTML
  • Want to prototype quickly with ready-made components
  • Need accessible components following semantic HTML patterns

Quick Start

Installation

Related skills
Installs
699
GitHub Stars
43
First Seen
Jan 23, 2026