Using Custom Colors in Charts

Ulrik (CRM Chart Guy) Chart XML, , , , , , , ,

Update 4/7/2017: Post updated and applies to all versions of Dynamics CRM from CRM 2011 to Dynamics 365.

At times it can be nice to define you own colors in charts. You may need to use a specific a corporate color scheme, make it easier to tell certain items apart or simply make the chart easier for the user to understand quickly.

It has always puzzled me how they chose the colors for some of the out-of-the-box system charts in Microsoft Dynamics CRM/Dynamics 365.

Take the “Cases by Priority” chart for example.

At first glance, this chart seems alright. Except when you look at how the series are colored, cases with “Normal” priority are red. In a chart like this red stands out more and most users would associate the red color with some kind of warning sign. On the other hand, the cases with priority high have the less alarming color blue.

Before we get into changing this specific chart, let’s look at some of our options for changing and modifying specific colors.

See this post for changing the complete Palette of a chart.

Export the charts XML file, open it and find the PaletteCustomColors property.

All the colors are listed as RGB colors, separated by a semicolon.

While Dynamics CRM/365 add RGB colors to its custom palette it should be noted that Dynamics CRM/365 accepts

  • RGB Decimal (example: 97, 142, 206)
  • RGB HEX (example: #4169E1)
  • Named colors (example: Blue)
  • ARGB (127, 97, 142, 206)

The named colors could prove a lot easier to work with.

So instead of PaletteCustomColors=”97,142,206; 209,98,96; 168,203,104; etc.
we could write PaletteCustomColors=”Blue; Red; Green; etc.

Using the color names also makes it a lot easier to check if you have added them in the correct order.

This page contains an overview of the named colors available to use in charts.
http://msdn.microsoft.com/en-us/library/aa358800.aspx
Bonus: There’s one color missing from this list and that is “Transparent”. Transparent is very handy when you need to add data to a chart, but actually don’t want to show it. For example, you may only want to display the value on a chart, but not have the bar or column visible.

Back to the example where we wanted to change the color scheme so high priority cases” are red and normal priority cases are blue.
Since Dynamics CRM/365 lists the series in reverse order (right to left) we know that blue is the first color and therefore goes to the series for high priority.

We want to change the order of the colors so red gets the first high priority series. Then blue and finally green.

To achieve that we need to edit the XML files so the first the colors of the PaletteCustomColors look like this.

Importing it back into Dynamics CRM/365 we will get this result for the “Cases By Priority” chart.

Now the high priority cases are appropriately red and the normal and low priority cases have less alarming colors. Word of caution here. If your list of record does not contain any high priority cases, then the first color will get assigned to the next priority. That means the color red would be assigned to the normal priority cases and so on.

On some charts, it is also possible to add specific colors to specific series, but I’ll save that for a later blog post.

Bonus: ARGB

Charts also support ARGB, which is similar to RGB, but there’s four values instead of three. The first value indicates the color’s Alpha transparency. 0 equals completely transparent. 255 is no transparency. 127 is 50% transparent etc.

Alpha transparency values are normally a percentage, but it has to be written in the RGB format which is a value between 0 and 255.

Hope you found the tip useful. As always please sign up for my newsletter and follow me on Twitter.

16 thoughts on “Using Custom Colors in Charts”

  4. I’m new to using CRM and I have what may be an easy question for you. I have a bar chart that displays individual salespeople and their total revenue. What I would like to do is change the color of each individual bar so that the lowest value displays Red and the highest displays Green. The rest should fill in like a gradient would. I’ve come close by making each bar have a gradient, but I want the gradient to spread across the entire bar chart field so that the whole bottom bar is one color and the top is another.I don’t know if this can be done, but any help would be greatly appreciated.

    Reply

    • Hi J New Guy
      Thanks for reading.
      Good question. I am actually not sure if it is possible.
      If I understand it correctly; if a sales person have a low score they only see the red section, and if they have a high score they see the bar go from red, all the way to green depending on how high the score is.
      I can tell you that there is no setting that’ll allow you to do that directly, but it MIGHT be possible if you combine some bar charts and stacked bar charts, one with the full gradient from red to green, and then another covering the parts you don’t want, or making the section transparent, or something. Don’t want to send you off on a wild goose chase here, so be aware that I’m certainly not sure. However, I know it’s something people ask for, so if I figure out how, I’ll be sure to blog about it. So follow me on Twitter or signup on the email list 
      You can see examples of combined charts in my posts “Advanced Goal Charts” and “Add Aggregate Total to Bar and Column charts”.

      Reply

    • Hi J, could you tell me a little bit how you did this. In my search for answers i want the bars to change colour depending if they have reached their monthly goal = green but if they are below 50% of goal then it should be red.

      Reply

  11. […] Finally we can add the extra Series. Since the Floating Revenue is fairly similar to Weighted Revenue from a charting perspective, we can just copy that series and make modifications to it. In addition to copying the series I modified the color property for the both the Weighted and Floating Revenue. I gave Weighted Rev. the DarkGray color, and Floating Rev. the LightGray color. Using the color names make it easier to not get them mixed up, rather than modifying the RGB values. […]

    Reply

  13. Hi, starting to get to grips with charts with your much appreciated help, and wondered if it is possible to have the full chart area use other background colours apart from white please

    Reply

Leave a comment