Proper way to disable dark mode in TW3

[the-kro]

Is setting dark to 'class' the correct way to disable dark mode in TW3? I am using DaisyUI, which has it's own dark mode implementation. In TW2 I just set dark to false.

[NovusOpus]

Check the Dark Mode Section in the Upgrade Guide

[lukewarlow]

Dark mode being on by default doesn't affect your CSS. It only does something when you have dark:example-class in your code.

Unless DaisyUI relies on dark:example-class syntax?

[NovusOpus]

They use something like this: <div data-theme="dark" ></div>, https://daisyui.com/docs/default-themes

[the-kro]

Dark mode being on by default doesn't affect your CSS. It only does something when you have dark:example-class in your code.

Unless DaisyUI relies on dark:example-class syntax?

I guess that makes sense with it being JIT and all. Thanks for the clarification.

[jessieconnralphsam]

They use something like this: <div data-theme="dark" ></div>, https://daisyui.com/docs/default-themes

thanks

[janat08]

My browser seems to have applied dark mode from daisyui automatically (which also happened on ios), until I specified light theme manually.

[devisreal]

Please how did you set this

[RomanKrasavtsev]

If you only want the default light theme, set themes config to false.

module.exports = {
  //...
  daisyui: {
    themes: false,
  },
}

https://daisyui.com/docs/themes/#-2

[fini]

The following will disable the dark theme, however it's not very well documented.

daisyui: {
  darkTheme: false,
},

[MUSHANIF]

thanks!

[naranyala]

or simply include only light themes

// tailwind.config.js
export default {
	daisyui: {
		themes: ["light"]
	}
}

[archbong]

#If you only want the default light and dark themes, set themes config to false.
module.exports = { //... daisyui: { themes: false, }, }
If you don't want to include any themes and disable all colors, set themes config to an empty array.
module.exports = { //... daisyui: { themes: [], }, }
If you're building with nextjs, put it in your tailwind.config.ts