Beginner's Guide for WordPress / Start your WordPress Blog in minutes

How to Add Dark Mode to Your WordPress Admin Dashboard

Do you want to add dark mode to your WordPress admin dashboard?

A night mode color scheme makes it easier to work during late hours by reducing white light coming from your screen.

In this article, we will show you how to easily add dark mode to your WordPress admin dashboard.

How to Add Dark Mode to Your WordPress Admin Dashboard

Note: This guide will show you how to to enable dark mode in your WordPress admin dashboard. If you want to enable dark mode to your site’s front end, then check our guide on how to add dark mode to your WordPress website.

What Is Dark Mode and Why Add it to Your Website?

If you often work on your WordPress website late at night, then the bright light from a computer screen can cause eye strain. Many apps, websites, and even operating systems come with a dark mode color scheme as an alternative.

Dark mode in macOS

Popular websites like YouTube also offer a dark color scheme. This gives users a more comfortable viewing experience when watching videos late at night.

YouTube dark theme

WordPress comes with admin color schemes, but none of the default color schemes reduce white light coming from your screen.

Luckily, there is a plugin that solves that.

Let’s take a look at how to easily add dark mode to your WordPress admin area for a more enjoyable user experience during late hours.

Adding Dark Mode to Your WordPress Admin Dashboard

First, you’ll need to install and activate the WP Dark Mode plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, you need to go to the WP Dark Mode » Settings page in your WordPress admin and click on the General Settings tab. You should be redirected there automatically.

WP Dark Mode General Settings

You’ll notice that the ‘Enable Frontend Darkmode’ switch is turned on. By default, this means your visitors will still see the light version of your website, but will have access to a dark mode switch.

If you only want to make dark mode available for the WordPress admin dashboard, then you should turn this switch off.

The toggle for ‘Enable Backend Darkmode’ is currently switched off. You’ll need to click the toggle to the on position.

WP Dark Mode General Settings Changed

The third switch, ‘Enable OS aware Dark Mode’, is switched on by default. This has no effect on the admin dashboard and can be left as it is.

Don’t forget to click the Save Settings button at the bottom of the page.

You will now see a new switch in the top bar of your admin area. Simply click on this switch to instantly toggle your admin area to dark mode.

Dark Mode Switch

Tip: If your site has multiple WordPress users, then each person can toggle dark mode on and off as they prefer. Their choice will be remembered the next time they log in to the WordPress admin dashboard.

Since ‘Dark Mode’ is not an admin color scheme, you can easily use it along with an existing WordPress admin color scheme. To set this, just go to Users » Profile and click on an option under Admin Color Scheme.

Admin Color Scheme

When you are writing or editing a post in the Gutenberg block editor, you will still see the light version of the page. You need to change a different setting to turn on dark mode in the editor.

Just click on the small color icon on the top left and select the Darkmode color scheme. Pro users have access to four additional dark color schemes.

Dark Mode in the Gutenberg Editor

We hope this tutorial helped you learn how to add dark mode to your WordPress admin dashboard.

You may also want to learn how to get a free SSL certificate for your website or check out our list of must have plugins to grow your site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit – a collection of WordPress related products and resources that every professional should have!

Reader Interactions

7 CommentsLeave a Reply

  1. Awesome!

    Thank you guys. It helped me to get desired dashboard dark theme. But I need the default editor background in dark theme too. It there any single plugin which can change the dashboard and editor background to dark mode?

    • You would want to reach out to the plugin’s support for their recommendation first


Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.