http://mahapps.com/guides/styles.html

 

Styles

Table of Contents

Overview

This guide will introduce you to the many accents and themes that MahApps.Metro has and how to create your own.

All of MahApps.Metro's accents and themes are contained within separate resource dictionaries (Make sure that all file names are spelled correct. They are Case Sensitive!).

How to change the current theme

You can choose between these available accents:

"Red", "Green", "Blue", "Purple", "Orange", "Lime", "Emerald", "Teal", "Cyan", "Cobalt", "Indigo", "Violet", "Pink", "Magenta", "Crimson", "Amber", "Yellow", "Brown", "Olive", "Steel", "Mauve", "Taupe", "Sienna"

and these themes:

"BaseLight", "BaseDark"

via App.xaml

The fastest way is to specify the accent and theme resource in App.xaml.

via ThemeManager

MahApps.Metro has a ThemeManager method that lets you change the accent and theme using the code-behind file. It can be done in 2 lines, like so:

public partial class App : Application { protected override void OnStartup (StartupEventArgs e) { // get the theme from the current application var theme = ThemeManager.DetectAppStyle(Application.Current); // now set the Green accent and dark theme ThemeManager.ChangeAppStyle(Application.Current, ThemeManager.GetAccent("Green"), ThemeManager.GetAppTheme("BaseDark")); base.OnStartup(e); } }

On a Window different to your Application's MainPage

With MahApps.Metro you can have a different accent and theme for a MetroWindow. The main window or any other MetroWindow will keep the specified accent and theme in the App.xaml.

You can also do this with the ThemeManager, like so:

public partial class AccentStyleWindow : MetroWindow { public void ChangeAppStyle() { // get the theme from the window var theme = ThemeManager.DetectAppStyle(this); // now set the Red accent and dark theme ThemeManager.ChangeAppStyle(this, ThemeManager.GetAccent("Red"), ThemeManager.GetAppTheme("BaseDark")); } }

Creating Custom Accents and Themes

Another nice feature of MahApps.Metro ThemeManager is to use custom created accents and themes or use a dynamically created accent and theme.

      
       
      
       #FF9F0055
       
       
      
       #CCD80073
       
       
      
       #99D80073
       
       
      
       #66D80073
       
       
      
       #33D80073
       
       
       
       
       
       
       
       
       
       
        
        
       
       
       
      
       White
       
       
     

In order to use this custom accent, you need to add it to the ThemeManager first.

public partial class App : Application { protected override void OnStartup(StartupEventArgs e) { // add custom accent and theme resource dictionaries ThemeManager.AddAccent("CustomAccent1", new Uri("pack://application:,,,/MahAppsMetroThemesSample;component/CustomAccents/CustomAccent1.xaml")); // get the theme from the current application var theme = ThemeManager.DetectAppStyle(Application.Current); // now use the custom accent ThemeManager.ChangeAppStyle(Application.Current, ThemeManager.GetAccent("CustomAccent1"), theme.Item1); base.OnStartup(e); } }

It is also possible to create an accent resource dictionary dynamically by using a specific color.