Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mudblazor/mudblazor
Blazor Component Library based on Material design with an emphasis on ease of use. Mainly written in C# with Javascript kept to a bare minimum it empowers .NET developers to easily debug it if needed.
https://github.com/mudblazor/mudblazor
blazor blazor-client blazor-components blazor-server blazor-webassembly component component-library components csharp hacktoberfest material netcore wasm
Last synced: about 3 hours ago
JSON representation
Blazor Component Library based on Material design with an emphasis on ease of use. Mainly written in C# with Javascript kept to a bare minimum it empowers .NET developers to easily debug it if needed.
- Host: GitHub
- URL: https://github.com/mudblazor/mudblazor
- Owner: MudBlazor
- License: mit
- Created: 2020-08-18T10:47:27.000Z (over 4 years ago)
- Default Branch: dev
- Last Pushed: 2024-10-28T20:22:05.000Z (3 months ago)
- Last Synced: 2024-10-29T10:26:45.748Z (3 months ago)
- Topics: blazor, blazor-client, blazor-components, blazor-server, blazor-webassembly, component, component-library, components, csharp, hacktoberfest, material, netcore, wasm
- Language: C#
- Homepage: http://mudblazor.com
- Size: 34.4 MB
- Stars: 8,020
- Watchers: 97
- Forks: 1,276
- Open Issues: 1,446
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Roadmap: ROADMAP.md
Awesome Lists containing this project
README
# Material Design components for Blazor
[](https://app.codecov.io/github/MudBlazor/MudBlazor)
[](https://sonarcloud.io/summary/overall?id=MudBlazor_MudBlazor)
[](https://github.com/mudblazor/MudBlazor/blob/master/LICENSE)
[](https://github.com/mudblazor/MudBlazor/stargazers)
[](https://github.com/mudblazor/mudblazor)
[](https://github.com/mudblazor/mudblazor/graphs/contributors)
[](https://github.com/mudblazor/mudblazor/discussions)
[](https://discord.gg/mudblazor)
[](https://twitter.com/MudBlazor)
[](https://www.nuget.org/packages/MudBlazor/)
[](https://www.nuget.org/packages/MudBlazor/)
MudBlazor is an ambitious Material Design component framework for Blazor with an emphasis on ease of use and clear structure. It is perfect for .NET developers who want to rapidly build web applications without having to struggle with CSS and Javascript. MudBlazor, being written entirely in C#, empowers you to adapt, fix or extend the framework. There are plenty of examples in the documentation, which makes understanding and learning MudBlazor very easy.
## Documentation & Demo
- [MudBlazor.com](https://mudblazor.com)
- [Try.MudBlazor.com](https://try.mudblazor.com/)
## Why is MudBlazor so successful?
- Clean and aesthetic graphic design based on Material Design.
- Clear and easy to understand structure.
- Good documentation with many examples and source snippets.
- All components are written entirely in C#, no JavaScript allowed (except where absolutely necessary).
- Users can make beautiful apps without needing CSS (but they can of course use CSS too).
- No dependencies on other component libraries, 100% control over components and features.
- Stability! We strive for a complete test coverage.
- Releases often so developers can get their PRs and fixes in a timely fashion.
## Prerequisites
| MudBlazor | .NET | Support |
| :--- | :---: | :---: |
| 1.x.x - 2.0.x | .NET 3.1 | Ended 03/2021 |
| 5.x.x | .NET 5 | Ended 01/2022 |
| 6.x.x | [.NET 6](https://dotnet.microsoft.com/download/dotnet/6.0), [.NET 7](https://dotnet.microsoft.com/download/dotnet/7.0), [.NET 8](https://dotnet.microsoft.com/download/dotnet/8.0) | Ended 01/2025 |
| 7.x.x | [.NET 7](https://dotnet.microsoft.com/download/dotnet/7.0), [.NET 8](https://dotnet.microsoft.com/download/dotnet/8.0) | Limited |
| 8.x.x | [.NET 8](https://dotnet.microsoft.com/download/dotnet/8.0), [.NET 9](https://dotnet.microsoft.com/download/dotnet/9.0) | :heavy_check_mark: |
> [!TIP]
> If you're updating to a newer version of MudBlazor, make sure to check out the [Migration Guide](https://github.com/MudBlazor/MudBlazor/blob/dev/MIGRATION.md) for detailed instructions on handling breaking changes and new features.
> [!WARNING]
> 1. Static rendering is not supported - [Learn more](https://learn.microsoft.com/aspnet/core/blazor/components/render-modes).
> 2. We cannot guarantee compatibility with browsers no longer maintained by their publishers.
For the best experience, use an up-to-date browser - See [Blazor supported platforms](https://learn.microsoft.com/aspnet/core/blazor/supported-platforms).
## Stats
## Contributing
👋 Thanks for wanting to contribute!
Contributions from the community are what makes MudBlazor successful.
If you are familiar with technologies like C#, Blazor, JavaScript, or CSS, and wish to give something back, please consider submitting a pull request!
We try to merge all non-breaking bugfixes and will deliberate the value of new features for the community.
Please note there is no guarantee your PR will be merged, so if you want to be sure before investing the work, feel free to [contact the team](https://discord.gg/mudblazor) first.
Check out the [contribution guidelines](/CONTRIBUTING.md) to understand our goals and learn more about the internals of the project.
## Getting Started
We have premade templates available at the [MudBlazor.Templates](https://github.com/mudblazor/Templates) repository.
Full installation instructions can be found [on our website](https://mudblazor.com/getting-started/installation).
### Quick Installation Guide
Install Package
```
dotnet add package MudBlazor
```
Add the following to `_Imports.razor`
```razor
@using MudBlazor
```
Add the following to the `MainLayout.razor` or `App.razor`
```razor
```
Add the following to your HTML `head` section, it's either `index.html` or `_Layout.cshtml`/`_Host.cshtml`/`App.razor` depending on whether you're running WebAssembly or Server
```razor
```
Next, add the following to the default Blazor script at the end of the `body`
```razor
```
Add the following to the relevant sections of `Program.cs`
```c#
using MudBlazor.Services;
```
```c#
builder.Services.AddMudServices();
```
### Usage
```razor
MudBlazor is @Text
@ButtonText
@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";
}
}
```