next-themes

Install

Use

With pages/

With app/

HTML & CSS

useTheme

API

ThemeProvider

useTheme

Examples

Use System preference by default

Ignore System preference

Class instead of data attribute

Force page to a theme

Disable transitions on theme change

Differing DOM attribute and theme name

Using with Cloudflare Rocket Loader

More than light and dark mode

Without CSS variables

With Styled Components and any CSS-in-JS

Avoid Hydration Mismatch

Images

CSS

With TailwindCSS

Using a custom selector (tailwindcss > 3.4.1)

Discussion

The Flash

FAQ