Today, I will explore the ExpressionDark Theme and will go through the process I use to generate many great looking variations of this theme. A killer tool that helps generate colors for themes is Kuler. what's even better is the Colorful Expression Add-in for Expression Design and Blend which in fact retrieves the colors from the Kuler back-end . This tool is great since it allows you to browse within Blend various color variations and generates brushes from those colors for you.
Here is a snapshot of the add-in as you will see it in Blend:
The codeplex site for Colorful Expression can be found here:http://www.codeplex.com/colorful. For the purpose of my work, I had to make minor changes to Colorful Expression Tool to generate the Brushes with the exact key that ExpressionDark Theme uses.
I created a simple silverlight application that helps preview how those colors will end up looking when applied to the Expression Theme. The top part of the screenshot below shows the different brushes defined on top of the ExpressionDark.xaml theme. The lower part shows few controls where the Expression Theme was applied using the colors defined above.
You can download the ThemeDesigner Application here
Let's walk through the workflow:
1) Loading the Solution with Colurful Add-in
2) you should see something like this:
3) Changing the color variations:
Delete the the "trees" grid
if you run the app, you will see the color scheme reflected in the controls:
4) Using the generated brushes to produce a new Expression variation
My goal with this application was to have a better design experience when tweaking the colors of the expression theme. I hope this will help you as well.
Download ThemeDesigner here