Home

Awesome

<!-- omit in toc -->

Material Design In XAML Toolkit Logo of Material Design in XAML

NuGet-Themes NuGet-Colors

NuGet-Themes-CI NuGet-Colors-CI

Backers on Open Collective Sponsors on Open Collective Chat Issues

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

See screenshots

<details> <summary>Table of contents</summary> </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-Package MaterialDesignThemes
<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>
<Window [...]
  Style="{StaticResource MaterialDesignWindow}"
  [...] >

Building the source

To build the project, following is required:

This repository also contains 3 different demo applications:

Screenshots

[!WARNING] The screenshots below are taken from the Material Design 2 demo app. It is possible that these are out of date. Run the demo app from latest source to see the latest version.

<details> <summary>Show images</summary>

Screenshot of WPF Material Design 2 demo application home page Buttons Toggles Fields ComboBoxes Palette Color Tools Pickers Icons Cards Menus and Toolbars Progress Bars Dialogs Lists Tree View Sliders Chips Typography Group Box Snackbars Elevation

</details>

More examples

FAQ

Contributing

Before contributing code read the Contribution Guidelines

Want to say thanks? 🙏🏻

This project exists thanks to all the people who contribute.

<a href="https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/graphs/contributors"> <img src="https://contrib.rocks/image?repo=MaterialDesignInXAML/MaterialDesignInXamlToolkit" /> </a>

Mentions

Backers

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

<a href="https://opencollective.com/materialdesigninxaml#backers" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/backers.svg?width=890"></a>

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. Become a sponsor.

<a href="https://opencollective.com/materialdesigninxaml/sponsor/0/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/0/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/1/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/1/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/2/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/2/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/3/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/3/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/4/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/4/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/5/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/5/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/6/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/6/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/7/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/7/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/8/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/8/avatar.svg"></a> <a href="https://opencollective.com/materialdesigninxaml/sponsor/9/website" target="_blank"><img src="https://opencollective.com/materialdesigninxaml/sponsor/9/avatar.svg"></a>