@nuxtjs/color-mode

Dark and light mode for Nuxt with auto detection
20,659,199 1,228
Install
npm install @nuxtjs/color-mode
Latest Version:4.0.1
Vue:3
License:MIT
Last Updated:Oct 19, 2026
Links: GitHub  ·  npm

@nuxtjs/color-mode

Nuxt Color Mode

npm version npm downloads License Nuxt Volta board

🌑 Dark and 🌕 Light mode with auto detection made easy with Nuxt.

nuxt-color-mode

Live demo

Features

  • Add .${color} class to <html> for easy CSS theming
  • Force a page to a specific color mode (perfect for incremental development)
  • Works with client-side and universal rendering
  • Auto detect system color-mode

📖  Read more

Note: v4 of @nuxtjs/color-mode is compatible with Nuxt 3+. If you're looking for the previous version of this module, check out the previous docs, or read more about the differences.

Contributing

You can contribute to this module online with CodeSandBox:

Edit @nuxtjs/color-mode

Or locally:

  1. Clone this repository
  2. Install dependencies using pnpm install
  3. Start development server using pnpm dev

License

MIT License

Copyright (c) Nuxt Team

Related Packages

@nuxtjs/i18n

Internationalization for Nuxt

23,877,608 2,085
@nuxtjs/tailwindcss

Tailwind CSS module for Nuxt

16,852,917 1,868
@nuxtjs/sitemap

Powerfully flexible XML Sitemaps that integrate seamlessly, for Nuxt.

10,334,110 441
@nuxtjs/mdc

Nuxt MDC module

7,786,445 400
@nuxtjs/robots

Tame the robots crawling and indexing your Nuxt site with ease.

8,776,519 529

Version History

Version Released License
4.0.1 MIT
4.0.0 MIT
3.5.2 MIT
3.5.1 MIT
3.5.0 MIT
Pre-releases (2)
Version Released License
3.0.0-beta.1 MIT
3.0.0-beta.0 MIT