Django admin colours

Question

The Django Admin page is different shades of blue by default. Where do I access how these colours are controlled? I want to change it all to shades of green instead of blue.

Ideas?

Answer 1

@Dominic Rodger is accepted answer. But in this I'm using Inline CSS and override Django base CSS.

Django Base CSS

Customize your AdminSite using Django Official Base CSS according to your need.

You can override Django Official Base CSS

body {
    margin: 0;
    padding: 0;
    font-size: 14px; # change default color
    font-family: "Roboto","Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
    color: #333;
    background: #fff; # Change color
}

---

Extend the base_site templates to add extra style to AdminSite.

Create directories and base_site.html.

your_project_root_directory/templates/admin/base_site.html

base_site.html

Copy these into your base_site.html.In style tag you can style your AdminSite

{% extends "admin/base.html" %}

{% block title %}{{ title }} | {{ site_title|default:_('Django site admin') }}{% endblock %}

{% block branding %}
<h1 id="site-name"><a href="{% url 'admin:index' %}">{{ site_header|default:_('Django administration') }}</a></h1>
{% endblock %}

{% block extrastyle %} # Here you can add your CSS

<style>

.module h2, .module caption, .inline-group h2,#header
{   
    margin: 0;
    padding: 2px 5px 3px 5px;
    font-size: 11px;
    text-align: left;
    font-weight: bold;
    background: #7CA0C7 url(../img/default-bg.gif) top left repeat-x;
    color: #fff;
}

</style>

{% endblock %}



{% block nav-global %}{% endblock %}

Answer 2

Update: Starting with Django 3.2, Django Admin now supports theming!

You can find information about this here. A list of all variables supported can be found here.