disable dark mode in django admin

Viewed 1529

The Problem

I installed Django after couple of months. Current version is 3.2.4.

Earlier Django-admin was just light-mode. Current Django-admin switches automatically to dark or light according to system theme. Well, I do not want this behaviour. I want Django-admin to be light theme irrespective of system theme. I am Not using 3rd party theme for Django-admin.


What I Tried?

As per one of the comment in this answer,

I decided to comment "@media (prefers-color-scheme: dark)" section in /static/admin/css/base.css . Not sure that it's good solution but the fastest one.

I tried commenting the code as shown here but does not work. I tried clearing cache and even tried switching browser but none of them seems to work. In browsers, I always prefer light theme. How can I achieve this? Any help is appreciable. Thanks in advance :)


System Details:

OS: Fedora 5.11.12-300.fc34.x86_64

Python-Verion: 3.9.5

3 Answers

Unfortunately at the moment there is no feature toggle for disabling this behavior (django 3.2). in order only to have the light theme, you should delete the entire block of @media (prefers-color-scheme: dark) code from django/contrib/admin/static/admin/css/base.css file. or you can disable prefers-color-scheme: dark from your browser rendering options. instructions for chrome are described in here

1st way: The fastest way is to go to your OS Settings and change from your theme from Dark to Light. If you are using Linux, you might need gnome-tweaks to switch between themes.


2nd way:

  1. Let us consider that you are using a virtual environment named venv. Now goto the following directory venv/Lib/site-packages/django/contrib/admin/static/admin/css/base.css
  2. Comment or delete all the code of prefers-color-scheme: dark. It would look something like this.
@media (prefers-color-scheme: dark) {
  :root {
      /* code */
}
  1. Now if you have also executed python manage.py collectstatic and let us assume that your static folder name is static/. Comment all the code of prefers-color-scheme: dark from the following file too: /static/admin/css/base.css

Note: Sometimes browser stores the CSS files in cache memory. To hard reload all the CSS files, hard reload the admin page using Ctrl + Shift + R.

The accepted answer only fixes it for the current user. A solution that would fix it for all users of the site would be similar, but would require copying base.css to your static/css directory and editing it there.

Alternatively (and this is what I did), just pip install django-light and add it to your INSTALLED_APPS just before django.contrib.admin

Related