Jump to content

AdminDevModeColors: different colors for development backends


Recommended Posts

Inspired by this thread with a little nugget based on AOS by @benbyf to visually distinguish development systems from production ones, I wrote a small module that does the same and lets you adapt colors and text.

Link to the github repo:


Version 0.0.1 is still very alpha and only tested on PW 3.0.124.


This module lets you change the color for the top toolbar and add a small piece of text for development systems, so you are immediately you aren't working on production (and vice versa). The adaptions are made through pure CSS and applied if either the "Enable DEV mode" checkbox in the module's configuration is checked or the property $config->devMode is set to true in site/config.php.

Works with Default, Reno and Uikit admin themes (though probably needs a lot of testing with different versions still).

Since a screenshot says more than thousand words...

Production system (unchanged):

Dev system (Default admin theme):

Dev system (Reno admin theme):

Dev system (Uikit admin theme):

Feel free to leave any feedback here and report any problems either in this thread or the github issue tracker.


  • Like 8
  • Thanks 1
Link to comment
Share on other sites

  • 4 weeks later...

@BitPoet  Many thanks for this nice helper!

Whats about a little enhancement like this?

	protected function getStyle() {
		$bgcolor = $this->bgColor;
		if($this->config->devModeBgColor) $bgcolor = $this->config->devModeBgColor;
		if(! $bgcolor) $bgcolor = 'rgb(153, 12, 94)';
		$fgcolor = $this->fgColor;
		if($this->config->devModeFgColor) $fgcolor = $this->config->devModeFgColor;
		if(! $fgcolor) $fgcolor = 'rgb(255, 255, 255)';
		$devstring = $this->devString;
		if($this->config->devModeDevString) $devstring = $this->config->devModeDevString;
		if(! $devstring) $devstring = 'DEV';


  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...