MaterialDesignInXamlToolkit
Product Information
Use Cases
Public chat
Support Plans
There are currently no OSS plans available
If you are a provider or contributor to the repository, you can start adding your OSS plan.
Add an OSS planContact us if you are looking for a plan for this open source.
We will help you get in touch with professional providers.
Product Details
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
Table of contents
- [Getting started](#getting-started) - [Building the source](#building-the-source) - [Screenshots](#screenshots) - [More examples](#more-examples) - [FAQ](#faq) - [Contributing](#contributing) - [Mentions](#mentions) - [Backers](#backers) - [Sponsors](#sponsors)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
<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 useMaterialDesign3.Defaults.xaml
. -
Alter your
MainWindow.xaml
<Window [...]
Style="{StaticResource MaterialDesignWindow}"
[...] >
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 libraryMaterialDesign3Demo
- Reference WPF app with Material Design 3 styling, under developmentMahAppsDragablzDemo
- Demo app for combining with Dragablz and MahApps
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.
Show images
![Screenshot of WPF Material Design 2 demo application home page](src/web/images/screen-home.png) ![Buttons](src/web/images/screen-buttons.png) ![Toggles](src/web/images/screen-toggles.png) ![Fields](src/web/images/screen-fields.png) ![ComboBoxes](src/web/images/screen-comboboxes.png) ![Palette](src/web/images/screen-palette.png) ![Color Tools](src/web/images/screen-colortools.png) ![Pickers](src/web/images/screen-pickers.png) ![Icons](src/web/images/screen-iconpack.png) ![Cards](src/web/images/screen-cards.png) ![Menus and Toolbars](src/web/images/screen-menutoolbar.png) ![Progress Bars](src/web/images/screen-progress.png) ![Dialogs](src/web/images/screen-dialogs.png) ![Lists](src/web/images/screen-lists.png) ![Tree View](src/web/images/screen-treeview.png) ![Sliders](src/web/images/screen-sliders.png) ![Chips](src/web/images/screen-chips.png) ![Typography](src/web/images/screen-typography.png) ![Group Box](src/web/images/screen-groupbox.png) ![Snackbars](src/web/images/screen-snackbars.png) ![Elevation](src/web/images/screen-elevation.png)More examples
FAQ
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 open collective
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.
Sponsors
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. Become a sponsor.