Material3.Avalonia 0.2.0-preview.1

Material3.Avalonia

A standalone Material Design 3 theme and component library for Avalonia 12.1 on .NET 8 or later. It does not depend on FluentTheme or SimpleTheme and is designed for desktop, Android, iOS, WebAssembly, trimming, and NativeAOT.

Documentation | WASM gallery | Releases

Features

• HCT/MCU dynamic color with light/dark schemes, contrast levels, and nine scheme variants.
• Material 3 themes for 80+ built-in Avalonia controls.
• Material-specific controls including chips, FAB menus, button groups, sheets, search, time picker, wavy progress, loading morphs, and range sliders.
• 4,007 Google Material Symbols Rounded 400 icons, optically sized for 24dp, in regular and filled variants as cached Avalonia Geometry objects.
• Pointer-centered ripples, state layers, elevation, expressive shape transitions, and responsive Gallery layouts.
• Desktop Gallery tray integration with a compact native menu.
• AOT/trim analyzers enabled in the library and shared Gallery UI.

Requirements

• .NET 8 or later
• Avalonia 12.1.1 or later

Install

Install the preview package:

dotnet add package Material3.Avalonia --version 0.2.0-preview.1

Or add an explicit package reference:

<PackageReference Include="Material3.Avalonia" Version="0.2.0-preview.1" />

Keep the Avalonia platform package used by your application, such as Avalonia.Desktop, Avalonia.Browser, Avalonia.Android, or Avalonia.iOS. Then replace FluentTheme with MaterialTheme:

<Application xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:m3="using:Material3.Avalonia"
             x:Class="MyApp.App">
  <Application.Styles>
    <m3:MaterialTheme SeedColor="#6750A4" />
  </Application.Styles>
</Application>

Material-specific controls use xmlns:m3c="using:Material3.Avalonia.Controls". See the controls overview for chips, FABs, navigation, sheets, settings rows, progress indicators, and other components.

RangeSlider

RangeSlider exposes independently bindable lower and upper values, optional indicators, snapping, direction reversal, keyboard input, and change events:

<m3c:RangeSlider Minimum="-100"
                 Maximum="100"
                 LowerValue="-25"
                 UpperValue="40"
                 TickFrequency="5"
                 IsSnapToTickEnabled="True"
                 ValueIndicatorMode="Always"
                 ValueFormat="0" />

See the slider documentation for the complete API.

Material Symbols

Use the strongly typed regular or filled icon catalogs directly with PathIcon.Data or Path.Data:

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:icons="using:Material3.Avalonia.Icons">
  <StackPanel Orientation="Horizontal" Spacing="12">
    <PathIcon Data="{x:Static icons:MaterialSymbols.Home}" />
    <PathIcon Data="{x:Static icons:MaterialSymbolsFilled.Favorite}" />
    <Path Data="{x:Static icons:MaterialSymbols.Search}"
          Fill="Black"
          Stretch="Uniform" />
  </StackPanel>
</UserControl>

The properties return lazily parsed, cached Avalonia Geometry instances, so unused icons have no parsing cost. See the icon documentation for C# usage and naming rules.

Run

dotnet run --project samples/Material3.Gallery
dotnet run --project samples/Material3.Gallery.Browser
dotnet run --project tests/Material3.Screenshots

NativeAOT

Tagged releases publish native artifacts for Windows x64, Linux x64, and macOS arm64. To publish locally:

dotnet publish samples/Material3.Gallery -c Release -r osx-arm64 --self-contained

Use win-x64 or linux-x64 for the other platforms.

License

Apache-2.0. Components whose APIs were modeled after m3fx retain attribution in source comments.