❌ localStorage — with flash

Dark mode with manual localStorage

Switch to dark theme, then refresh the page (Ctrl+R). You will see the flash.

Why does it flicker?

The server has no access to localStorage, so it renders the default light theme. Only after the JS loads in the browser is the theme applied — hence the visible flash.

How to reproduce the flash

1. Click the button above to enable dark theme.
2. Refresh the page (Ctrl+R or F5).
3. You will see a brief flash of light background before dark theme loads.

Most visible in a production build

Run pnpm build && pnpm start — in dev mode Next.js may behave slightly differently. The flash is most visible in production.