Dark or light? The choice follows you: dark mode in the WordPress admin

WordPress Dark Mode

A button that's always within reach flips the whole dashboard. The preference belongs to each user and travels with the account: it's there on the same site from another computer, with nothing to reconfigure.
The switch is instant, with no page reload.

How WordPress dark mode works

Dark mode in the WordPress admin: personal, not site-wide

Dark mode isn't a global setting an administrator imposes on everyone: it's a preference saved on each user's profile. People working at night keep it on, people in a bright office don't, and neither bothers the other.

  • It's toggled from a floating button in the bottom-right corner — sun or moon depending on the state — and from the dedicated item in the Deskmode Suite menu in the admin bar.
  • The choice is stored both in the browser and on the user profile: the browser applies it immediately, the profile keeps it for next time and for other devices.
  • The switch happens in place: no reload, no white flash between screens.
  • The preference applies to the login screen too, which is where the wrong contrast is most irritating.
  • It works alongside the accent chosen in the admin theme: colour and brightness are two separate levers.

Where it deliberately steps back

Dark mode switches itself off in two places, and that's a considered choice:

  • The theme customizer: there you're judging how the public site looks, not the dashboard, and a dark interface around it would skew your reading of the colours.
  • Elementor screens: Elementor forces a light background on its own panels. Layering a dark theme over that would produce light text on a light background — unreadable. Better not applied than applied badly.

There's also a class for excluding specific screens, if a plugin you use behaves the way Elementor does.

Done properly

  • The content editor gets its own treatment: a dark writing area without the post content itself changing away from how it will actually publish.
  • Login field backgrounds are handled in CSS rather than inline styles, so the toggle really does update the colour live; any inline styles left by older versions or by the browser's autofill are removed, since they'd stay stuck at the starting value.
  • Animations respect the system preference for reduced motion.

Read the documentation

WordPress dark mode screenshot
WordPress dark mode: login in dark and light mode.

Frequently asked

WordPress dark mode: the questions we get most

Five answers on who decides about dark mode in the WordPress admin, what gets covered, and where dark mode deliberately steps back.

Does WordPress dark mode apply to the whole site or just to me?

Just to you. It is a preference saved on your own user profile, not a site setting: people working at night keep it on, people in a bright office don’t, and neither bothers the other.

It is stored both in the browser and on the account: the browser applies it immediately, the profile keeps it for next time and for other devices. And it never touches your public site, which keeps looking to visitors exactly as it did before.

Does it follow my operating system’s dark mode automatically?

No, and that’s a choice. There is a system preference that browsers expose to websites through the prefers-color-scheme media query, and hooking into it would have been easy.

The trouble is that the two rarely coincide. People running a light system often want a dark dashboard for long sessions, and people on a dark system sometimes prefer a light workspace when they are judging colours. An explicit switch leaves the decision to you, whereas the automatic version would change the interface under your hands at sunset.

Does dark mode in the WordPress admin cover other plugins’ screens?

Partly, and we would rather be precise than promise too much. Dark mode in the WordPress admin covers the admin area proper: menus, list tables, settings pages, metaboxes and everything built with core markup, which is most of what you look at every day.

Screens a plugin styles entirely on its own keep their own appearance. That is deliberate: forcing a dark background onto a component designed for a light one produces unreadable badges, invisible status dots and charts you cannot decipher. Readable and slightly inconsistent beats consistent and broken.

Why does it switch off in the customizer and in Elementor?

In the customizer you are judging how your public site looks, not the dashboard: a dark interface all around would skew your reading of the colours you are choosing.

Elementor, for its part, forces a light background onto its own panels. Layering a dark theme over that would give light text on a light background — unreadable. Better not applied than applied badly. There is also a class for excluding other screens, if a plugin you use behaves the same way.

Does switching require a page reload?

No, it happens in place: no reload, and no white flash between screens. The button is always within reach in the bottom-right corner, showing a sun or a moon depending on the state, and there is a dedicated item in the admin bar menu as well.

The preference applies to the login screen too, which is where the wrong contrast is most irritating. Animations respect the system setting for reduced motion.

Shopping Basket