daisyUI
@daisyui.com
Tailwind CSS component library by daisyUI. Build faster with semantic components, built-in themes, and reusable UI blocks.
daisyUI's Company Logos


daisyUI's Brand Colors
Hex Code
Color name
RGB
HSL
CMYK
#FFB656
Texas Rose
255, 182, 86
34, 100, 67
0, 29, 66, 0
#FADBAC
Peach Yellow
250, 219, 172
36, 89, 83
0, 12, 31, 2
#0F0F0F
Cod Gray
15, 15, 15
0, 0, 6
0, 0, 0, 94
About daisyUI
Instead of using constant color utility classes like bg-green-500 or bg-orange-600, daisyUI suggests using semantic color utility classes such as bg-primary, bg-secondary, and bg-accent. Each color name comes with CSS variables that are applied when a daisyUI theme is used. Using semantic color names has multiple benefits.
It makes design interfaces more logical, as specific colors like primary and secondary are defined and used consistently. Additionally, theming becomes easier, as you don't need to define dark-mode colors for every element and you're not limited to only light or dark themes. With daisyUI, you have access to a list of color names that can be used in your theme or utility classes.
These color names include primary, secondary, accent, neutral, and others. By incorporating these colors into your project, you can create beautiful and cohesive interfaces. To use daisyUI colors, you can apply color modifier class names to components or use utility classes just like Tailwind's original color names.
These utility classes include bg-{COLOR_NAME}, text-{COLOR_NAME}, border-{COLOR_NAME}, and more. Discover the power of daisyUI to enhance your web design and make theming a breeze
