Navigate:
daisyUI
~$DAISY0.2%

daisyUI: Component library for Tailwind CSS

Semantic component classes extending Tailwind CSS utilities.

LIVE RANKINGS • 12:29 PM • STEADY
OVERALL
#215
90
FRONTEND
#18
9
30 DAY RANKING TREND
ovr#215
·Front#18
STARS
40.4K
FORKS
1.6K
7D STARS
+91
7D FORKS
+3
See Repo:
Share:

Learn more about daisyUI

daisyUI is a component library that extends Tailwind CSS with ready-made UI components. It works as a Tailwind CSS plugin that adds component classes on top of Tailwind's utility-first approach. The library includes buttons, cards, modals, forms, navigation elements, and other common interface patterns. Components are framework-agnostic at the HTML level but have implementations available for popular JavaScript frameworks.

daisyUI

1

Tailwind CSS Plugin

Integrates directly into Tailwind's configuration system as a native plugin. Components inherit your existing theme tokens, spacing, and breakpoints without separate CSS files or build steps.

2

Framework-Agnostic Components

Pure HTML and CSS implementation works across React, Vue, Svelte, and vanilla JavaScript. Same component markup patterns deploy everywhere without framework-specific rewrites or wrapper libraries.

3

Built-in Theme System

Includes 30+ pre-designed themes that can be switched with a single data attribute. Create custom themes by overriding CSS variables, enabling rapid visual customization without rebuilding styles.


<!-- Simple daisyUI button -->
<button class="btn btn-primary">
  Click me
</button>

<!-- Button with different sizes -->
<button class="btn btn-secondary btn-sm">Small</button>
<button class="btn btn-accent btn-lg">Large</button>


See how people are using daisyUI

Loading tweets...


[ EXPLORE MORE ]

Related Repositories

Discover similar tools and frameworks used by developers