ui/docs/content/1.getting-started/7.color-mode.md

description, links, navigation

description	links	navigation
	label to target icon nuxtjs/color-mode https://github.com/nuxt-modules/color-mode _blank i-simple-icons-github	badge label Todo

Thanks to @nuxtjs/color-mode, you can easily switch between light and dark themes.

All the components are styled with dark mode in mind.

Thanks to Tailwind CSS dark mode class strategy and the @nuxtjs/color-mode module, you literally have nothing to do.

You can disable dark mode by setting the preference to light instead of system in your nuxt.config.ts.

export default defineNuxtConfig({
  colorMode: {
    preference: 'light'
  }
})

::tip If you're stuck in dark mode even after changing this setting, you might need to remove the nuxt-color-mode entry from your browser's local storage. ::