Material Design In XAML Toolkit

Comprehensive and easy to use Material Design theme and control library for the Windows desktop (WPF).

Material Design styles for all major WPF Framework controls
Additional controls to support the theme, including Multi Action Button, Cards, Dialogs, Clock
Easy configuration of palette (at design and runtime), according to Google's guidelines
Full Material Design Icons icon pack
Easy transition effects
Compatible with Dragablz, MahApps
Demo applications included in the source project

See screenshots

<details> <summary>Table of contents</summary>

Getting started
Building the source
Screenshots
More examples
FAQ
Contributing
Mentions
Backers
Sponsors

</details>

Getting started

[!NOTE] See the full starting guide for more in-depth information.

This quick guide assumes you have already created a WPF project and are using Microsoft Visual Studio 2022.

Install the toolkit through the visual NuGet package manager in Visual Studio or use the following command:

Install-Package MaterialDesignThemes

Alter your App.xaml

xml

<Application 
  x:Class="Example.App"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
  StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <materialDesign:BundledTheme BaseTheme="Light" PrimaryColor="DeepPurple" SecondaryColor="Lime" />

                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesign2.Defaults.xaml" /> 
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

If you want to target Material Design 3, alter the ResourceDictionary line in the snippet above to use MaterialDesign3.Defaults.xaml.
Alter your MainWindow.xaml

xml

<Window [...]
  Style="{StaticResource MaterialDesignWindow}"
  [...] >

XML Namespaces

The toolkit exposes two XML namespaces for use in XAML:

Prefix	URI	Description
`materialDesign`	`http://materialdesigninxaml.net/winfx/xaml/themes`	Primary namespace for all public Material Design types, controls, and converters.
`materialDesignInternal`	`http://materialdesigninxaml.net/winfx/xaml/themes-internal`	Namespace for types in internal sub-namespaces (`MaterialDesignThemes.Wpf.Internal`, `MaterialDesignThemes.Wpf.Converters.Internal`, `MaterialDesignThemes.Wpf.Behaviors.Internal`).

[!WARNING] Types exposed via the materialDesignInternal namespace are considered internal implementation details and are not guaranteed to maintain backwards-compatibility between versions. Use them at your own risk.

To use the internal namespace in XAML:

xml

<Window ...
  xmlns:materialDesignInternal="http://materialdesigninxaml.net/winfx/xaml/themes-internal">

Building the source

To build the project, following is required:

Microsoft Visual Studio 2022
.NET desktop development workload

This repository also contains 3 different demo applications:

MaterialDesignDemo - Reference WPF app with Material Design 2 styling, this contains all controls and is a recommended tool when developing apps with this library
MaterialDesign3Demo - Reference WPF app with Material Design 3 styling, under development
MahAppsDragablzDemo - Demo app for combining with Dragablz and MahApps

Screenshots

<details> <summary>Material Design 3 demo app screenshots</summary>

</details> <details> <summary>Material Design 2 demo app screenshots</summary>

[!WARNING] The screenshots below are taken from the Material Design 2 demo app. Material Design 3 is the latest version, so the UI shown here may differ from the latest design.

</details>

More examples

FAQ

How to increase rendering performance?

Contributing

Before contributing code read the Contribution Guidelines

GitHub issues are for bugs and feature requests.
For questions, help and chat in general, please use the GitHub discussion tab or the Discord server.
Stack Overflow tag: material-design-in-xaml

Want to say thanks? 🙏🏻

Hit the :star: star :star: button
If you'd like to make a very much appreciated financial donation please visit <a href='https://opencollective.com/materialdesigninxaml'>open collective</a>

This project exists thanks to all the people who contribute.

Mentions

James Willock - Founder of the project
Kevin Bost - Maintainer of the repository
Snalty - Designer of the logo
Icon pack sourced from Material Design Icons
ControlzEx - Library used in MaterialDesignInXAML
Ignace Maes - Whose Material Skin project inspired the original material design theme for Dragablz, which in turn led James Willock start this project
Material Design Extensions - A community repository based on this library that provides additional controls and features.
Contributors - A big thank you to all the contributors of the project!

Backers

Thank you to all our backers! 🙏 Become a backer.

Material Design In XAML Toolkit

Material Design In XAML Toolkit

Getting started

XML Namespaces

Building the source

Screenshots

More examples

FAQ

Contributing

Mentions

Backers

Sponsors