next-themes

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

by pacocoursey

dark-mode dark-theme nextjs react themes

Star on GitHub ForkWebsite npm

TypeScript

6.3k stars 252 forks 38 contributorsQuiet · 4mo agoSince 2020MIT

Meet the team

See all 38 on GitHub →

pacocoursey71 contributions

trm21711 contributions

BlankParticle5 contributions

Bot

dependabot[bot]4 contributions

brunocrosier2 contributions

0xflotus1 contribution

Unsleeping1 contribution

amrhassab1 contribution

Recent PRs & issues

Quiet · Last activity 4mo ago

See all on GitHub →

fix: replace typeof window with typeof document for Node.js 25+ SSR compatibilityOpenPR

Problem Node.js 25+ ships an experimental Web Storage API that aliases to . This breaks on Node.js 25+ because the SSR guard evaluates at module load time: This causes: on the server calls on the server nonce rendered empty during SSR on startup Reported in #389. Fix Replace with . is a browser-only API — Node.js does not expose it, even in v25+. This is a reliable cross-version SSR guard: Changes — 2 occurrences updated Testing Tested on Node.js v24.15.0, pnpm v10.32.1.

EduardF1 · 2d ago

docs: add Tailwind v4 data-theme approach that avoids hydration mismatchOpenPR

Summary Fixes #364 The Avoid Hydration Mismatch section documents the state pattern, but there is a simpler option for Tailwind users that the README doesn't cover: using next-themes' default attribute together with Tailwind v4's CSS syntax. Because is written to `mountedattributedata-themeuseState(false)useEffect` mount dance required.

luisangelrod · 1w ago

[Feature request]: consent managmentOpenIssue

What feature would you like to see? According to GDPR and ePrivacy, you may not persist theme data without a consent (Usually themes go under "preference" consent category, which isn't essential). Can you, please, add a way to pass this consent to next-themes?

gavrilikhin-d · 1mo ago

Structured data for AI agents

Repository: pacocoursey/next-themes. Description: Perfect Next.js dark mode in 2 lines of code. Support System preference and any other theme with no flashing Stars: 6302, Forks: 252. Primary language: TypeScript. License: MIT. Homepage: https://next-themes-example.vercel.app/ Topics: dark-mode, dark-theme, nextjs, react, themes. Open PRs: 20, open issues: 46. Last activity: 4mo ago. Top contributors: pacocoursey, trm217, BlankParticle, dependabot[bot], brunocrosier, 0xflotus, Unsleeping, amrhassab, andreacassani, arturbien and others.