Material Themes Blending

Telerik UI for WinForms suite offers a touch optimized theme which provides additional features such as custom fonts, built-in animations and shadows. We also have three other themes that are using the Material theme as a foundation but have different colors:

  • MaterialBlueGray
  • MaterialPink
  • MaterialTeal

Figure 1: Material Themes

tools-visual-style-builder-working-with-visual-style-builder-material-themes-blending 001

Generate Material Variation

Visual Style Builder provides an easy way to generate different color variations of the Material theme. Material theme blending uses the basic Material theme by executing a series of predefined commands.

Select Tools >> Generate Material Variation menu item:

Figure 2: Generate Material Variation

tools-visual-style-builder-working-with-visual-style-builder-material-themes-blending 002

tools-visual-style-builder-working-with-visual-style-builder-material-themes-blending 006

If you already have loaded a customized Material theme (but not a Material variation) it will remain loaded when generating a Material variation.

This will open the Material Blend Dialog from which you can choose the Primary color and the Accent color:

Figure 3: Material Blend Dialog

tools-visual-style-builder-working-with-visual-style-builder-material-themes-blending 003

If you click the Generate theme button, a new variation of the Material theme will be exported using the selected colors.

Figure 4: Save the Theme

tools-visual-style-builder-working-with-visual-style-builder-material-themes-blending 004

After loading the custom theme in Theme Viewer the primary/accent colors are replaced:

Figure 5: Load Material theme's variation

tools-visual-style-builder-working-with-visual-style-builder-material-themes-blending 005

See Also

In this article
Not finding the help you need? Improve this article