Changing the colors in the administration panel

After changing the logo, the next noticeable touch you can make is change the color scheme used in your Joomla! administrator panel.

Getting ready

Open your administrator template's general.css file in preparation for editing it (we'll be using the Khepri template in this example; other administrator templates tend to retain the use of template.css for the bulk of their style).

How to do it...

1. 1. Our aim is to change the blue-colored elements used in this administrator template to match the green theme that we're using. In general.css, you need to locate the .header class to affect the color of the heading.

   div.header {
   font-size: 22px;
   font-weight: bold;
   color: #58962A;
   line-height: 48px;
   padding-left: 55px;
   background-repeat: no-repeat;
   margin-left: 10px;
   }
   

2. 2. Next, style the other blue elements by doing a find and replace on #0B55C4, the RGB hex value for the blue used in the document, for your new green color, which is #58962A. In particular...