nuxt-modules/color-mode

Dark and Light mode with auto detection made easy with Nuxt 🌗

TypeScript

1,228

386 commits

updated Oct 12, 2026

color-mode.nuxtjs.org

See the code

README

Nuxt Color Mode

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

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:

Or locally:

Clone this repository
Install dependencies using pnpm install
Start development server using pnpm dev

License

MIT License

color-scheme

dark-mode

dark-theme

nuxt-module

Significant stargazers

Dongpo Liu

739 followers · starred Dec 2023

ハン / Han

488 followers · starred Sep 2024

Andrew Boyd

118 followers · starred May 2020

Yunfei He

1,159 followers · starred Jan 2026

Similar repos

nuxt-modules/tailwindcss

Tailwind CSS module for Nuxt

1,869

same org

sandoche/Darkmode.js

🌓 Add a dark-mode / night-mode to your website in a few seconds

2,768

boopathikumar018/docsify-darklight-theme

A Dark and Light theme with switch for your docsify site

154

GoogleChromeLabs/dark-mode-toggle

A custom element that allows you to easily put a Dark Mode 🌒 toggle or switch on your site:

1,226

pacocoursey/next-themes

Perfect Next.js dark mode in 2 lines of code. Support System preference and any other theme with no…

6,334

donavon/use-dark-mode

A custom React Hook to help you implement a "dark mode" component.

1,282

linx4200/vue-color

A modern collection of Vue color pickers – fast, accessible, and easy to use.

2,611

nordtheme/nord

An arctic, north-bluish color palette.

6,893