Monitoring Colours

Making sense of yellow alert and magenta state


Because I'm dealing with many monitoring systems, and they confused about their colour schemes. "red alert" for an emergency is about the only thing they can agree upon.


People who are designing interfaces for monitoring widgets and tools. Sadly, my schemes may fail for colourblind people (1 in 4 men, but I usually see 1 in 3 for men working in I.T.). See below for how one application has thoughtfully gotten around that.


For each item being monitored, it can be measured on two axes:

This puts every item being monitored into four categories:

Traditionally, the 1st category is colour-coded red, and the 2nd catetory is colour-coded green. The other states have no traditional colours, although the range from amber to red are usually used as a gradient along the No Priority <-> Action Required axis.

I propose that the different states that a monitored value can be in can correspond radially to a monitor's state on these two axes. For those of you not living in ivory towers: I think I know a way for colours of the rainbow to make sense with monitoring states, and in a way that is consistent.

[] To the left you can see a box with the up/down edges and the left/right edges labeled. Each corner of the box is one of the four catetories mentioned above. As something in the upper right corner ("We know we must do something") moves down to the lower right corner ("It's okay, leave it alone"), it's colour shift through the spectrum from red to green. As it moves from the upper-right corner to the upper-left ("It's not responding, find out why.") the colour shifts from red to purple. If you think in hues and radians, you can see the typical emergency state starts the the top with 0/red, moves through the typical okay state at 120/green, and the typical disabled state ("don't know, don't care") at 225/indigo.

Chances are, you've spent more time writing HTML code by hand than taking colour theory classes in college, so at right I've got the colours and states written in style hexidecimal colours. expand on this, some helpful algorithms for gradients

unknown bad
known bad
unknown poor
known poor
unknown good
known good