ThemeManager component for MudBlazor to design, test or do live changes to Mudblazor themes.
$ dotnet add package MudBlazor.ThemeManager
Blazor Theme Manager component for MudBlazor library. Can be used live or during development to fast and easy try out different theme settings.
This component is not suitable for prod applications, be ready for performance issues, bugs and missing features. Feel free to help improve it.

Install Package
dotnet add package MudBlazor.ThemeManager
Add the following to _Imports.razor
@using MudBlazor.ThemeManager
Add the following to index.html (client-side) or _Host.cshtml (server-side) in the head
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
<link href="_content/MudBlazor.ThemeManager/MudBlazorThemeManager.css" rel="stylesheet" />
Add the components in your and inside
MainLayout.razor<MudLayout><MudThemeManagerButton OnClick="@((e) => OpenThemeManager(true))" />
<MudThemeManager Open="_themeManagerOpen" OpenChanged="OpenThemeManager" Theme="_themeManager" ThemeChanged="UpdateTheme" />
Add the following inside your @code for MainLayout.razor
private ThemeManagerTheme _themeManager = new ThemeManagerTheme();
public bool _themeManagerOpen = false;
void OpenThemeManager(bool value)
{
_themeManagerOpen = value;
}
void UpdateTheme(ThemeManagerTheme value)
{
_themeManager = value;
StateHasChanged();
}
protected override void OnInitialized()
{
StateHasChanged();
}
Connect the ThemeManagerTheme with MudThemeProvider to control all the theme colors. You can also connect MudAppBar and MudDrawer directly.
<MudThemeProvider Theme="_themeManager.Theme" />
<MudAppBar Elevation="_themeManager.AppBarElevation">
<MudDrawer @bind-Open="_drawerOpen" ClipMode="_themeManager.DrawerClipMode" Elevation="_themeManager.DrawerElevation">