FAQ
Frequently Asked Questions – Common problems and how to fix
Class names are not working
- Make sure you're not usingdynamic class names(half-variable like
btn-{$color}). If you do this, there is no way for Tailwind CSS to find your class names. - Try using
@sourceExplicitly register sources
CSS files is too big
Using Tailwind CSS and daisyUI, it is expected for CSS files to be very small. Ideally only the class names you used must be in the CSS file. Sometimes (specially in monorepos) it is possible thatTailwind CSS automatic class name detectionfinds some unwanted strings in your project and generate styles for them. To avoid this, you candisable automatic detectionand register your source files using@sourcedirective.
checkbox/toggle/radio styles are broken
Probably you're using@tailwindcss/forms(or another style or plugin) that is affecting form elements.
daisyUI applies styles to class names but@tailwindcss/formsby default, applies styles to all form elements.
If you really need@tailwindcss/formsalongside with daisyUI (which I doubt, because both are doing the same job) consider using itsstrategy: 'class' configso it only applies style to the elements with specific class name (not all form elements)
Themes are not working
- Add the themes you want
- Enable a theme using
data-themeon your<html>tag: - If you're using a custom theme make sure you're usingall the required CSS variables
Tailwind's prefix is not workingdark:Tailwind's prefix is not working
With daisyUI, you don't need to manually set colors usingdark: variant
As long as you usedaisyUI colorsthey will work on all themes, light or dark.
If you really want to use Tailwind'sdark:variant,here's how to do it.
