Create icons for Dynamics CRM 2013/2015/Online

Back in the days of Dynamics CRM 2011 full color icons were the default, but now Microsoft has changed the look and feel. This new user interface of Dynamics CRM does require you to rethink how to work with icons. The larger icons appear to be blueish and white when you hover over them, while the smaller icons are grayish.

The guys at Magnetism have done a great job describing where these icons are displayed, however it would also be useful to have some guidance on how to create these new icons. You can of course go back to a designer and have this done for you, but there are some easy tricks to get existing icons updated or redesign any of the free resources to match the new UI.

First of all, it's good to know that the icons in the menu bar which appear as light blue, aren't actually blue. The icons are white (RGB: FFFFFF), but CRM renders them in light blue until the user hovers over. This means that while developing your 32x32 pixel images, you can make them white. An easy and cheap approach to do this, is to use paint.net.

Within paint.net, you can open the image:

 Then go to "Adjustments" -> "Curves":

Drag the dot from the left top to the right top. You'll see the code change from (0, 255) to (255,255):

And your image appears in white.

The smaller images, only used for entities, the color is in gray shades. You can either use the same approach as above to transform the image to gray, but an even easier approach is to use the black & white option:


After saving your images, then you can upload them to CRM as a web resource and start using them in the sitemap or as entity icons.

2 comments:

Charles Wattson said...

The look and feel has changed for Dynamics CRM 2013 / 2015; you need to think twice on how to work with this icons.

Black Kitty said...

My blog: Learn C#