MaterialDesignInXAML / MaterialDesignInXamlToolkit

Google's Material Design in XAML & WPF, for C# & VB.Net.
http://materialdesigninxaml.net
MIT License
14.82k stars 3.4k forks source link
c-sharp design dragablz hacktoberfest hacktoberfest2020 material material-design theme wpf xaml

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

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.

<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.

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

Want to say thanks? 🙏🏻

This project exists thanks to all the people who contribute.

Mentions

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.