Build stunning, interactive web applications with MudBlazor — the free, open-source Material Design library for Blazor.

🌐 Documentation ⚡ Interactive Playground

🎨 Beautiful, responsive Material Design components
💻 Fully written in C# with minimal JavaScript
📖 Comprehensive documentation and examples
✅ Extensive test coverage

We have ready-to-go templates at the Templates repository, or follow the quick install guide below:

Install Package:

dotnet add package MudBlazor

_Imports.razor:

@using MudBlazor

MainLayout.razor or App.razor:

<MudThemeProvider/>
<MudPopoverProvider/>
<MudDialogProvider/>
<MudSnackbarProvider/>

HTML head section (index.html/_Layout.cshtml/_Host.cshtml/App.razor):

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />

The default Blazor script at the end of the body:

<script src="_content/MudBlazor/MudBlazor.min.js"></script>

Program.cs:

using MudBlazor.Services;

builder.Services.AddMudServices();

<MudText Typo="Typo.h6">
    MudBlazor is @Text
</MudText>

<MudButton Variant="Variant.Filled" 
           Color="Color.Primary" 
           OnClick="ButtonOnClick">
    @ButtonText
</MudButton>

@code {
    string Text { get; set; } = "????";
    string ButtonText { get; set; } = "Click Me";
    int ClickCount { get; set; }

    void ButtonOnClick()
    {
        ClickCount += 1;
        Text = $"Awesome x {ClickCount}";
        ButtonText = "Click Me Again";
    }
}

For more details, see the complete installation guide on our website.

Contributions from the community are what makes MudBlazor successful.
Whether it's fixing bugs, adding features, or improving documentation, everything counts.

💬 Feel free to chat with us on Discord to get feedback before diving in.
📚 Check out our contribution guidelines to get started and learn more about how the project works.
✅ If a PR fixes something you reported, locally test a preview version to ensure your app works as expected.