Theme Provider
The Theme provider specifies all the colors, shapes, sizes and shadows to your layout. No configuration or theme is needed, by default it will use MudBlazor's default theme.
<MudThemeProvider />
Variables
At the moment, it's possible to change the following theme types.
- Palette
Shadows
- Typography
Layout Properties
- z-index
Pseudo CSS scope
- Pseudo CSS
You can find all the Default Theme values under customization.
Scrollbar
The MudBlazor styled scrollbar can be turned off in the themeprovider with the DefaultScrollbar property.
<MudThemeProvider DefaultScrollbar="true" />
Dark Palette
Dark palettes are integrated in MudTheme. Just set IsDarkMode to true.
This is an example text!
<MudThemeProvider @bind-IsDarkMode="@_isDarkMode" Theme="_theme"/> <MudSwitch @bind-Value="_isDarkMode" Color="Color.Primary" Class="ma-4" T="bool" Label="Toggle Light/Dark Mode"/> <MudText Class="ma-4">This is an example text!</MudText>
@code{ private MudTheme _theme = new(); private bool _isDarkMode; }