---
title: Color Mode
description: 'Nuxt UI integrates with `@nuxtjs/color-mode` to allow for easy switching between light and dark themes.'
links:
  - label: 'nuxtjs/color-mode'
    to: https://github.com/nuxt-modules/color-mode
    target: _blank
    icon: i-simple-icons-github
---

## Usage

Nuxt UI automatically registers the `@nuxtjs/color-mode` module for you, so there's no additional setup required.

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

```ts [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.
::