Blazorise is a component library built on top of Blazor and CSS frameworks like Bootstrap, Bulma and Material.
Branch: master
Clone or download
Mladen Macanović
Mladen Macanović new: unit tests
Latest commit 4436a38 Feb 19, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
Build bumb version 0.6.0-preview5 Feb 15, 2019
NuGet bumb version 0.6.0-preview5 Feb 15, 2019
Source fixed validations Feb 15, 2019
Tests new: unit tests Feb 18, 2019
docs update docs Feb 14, 2019
.gitignore new: docs Dec 10, 2018
Blazorise.sln new: unit tests Feb 18, 2019 fix: licence extension Dec 1, 2018 Update Feb 14, 2019
build.cmd updated vs2019 build path in build.bat Feb 8, 2019
clean.bat new: clean bat Feb 7, 2019

Blazorise components for Blazor

Blazorise is a component library built on top of Blazor and CSS frameworks like Bootstrap, Bulma and Material.


Blazorise version 0.6 and above are now updated for Blazor 0.8 and .Net Core 3.0 preview2. This version will work only in Visual Studio 2019. If you're still using Blazor 0.7, in that case you will use Blazorise v0.5.x!


Please look at demos to see Blazorise in action.

Note: This project is still experimental so it's possible that some components will be removed or refactored.

Releases and Roadmap


  • NuGet Nuget
  • Join the chat at


There are 3 diferent NuGet packages for each of the supported CSS frameworks. Available packages are:

Install-Package Blazorise.Bootstrap
Install-Package Blazorise.Bulma
Install-Package Blazorise.Material

Before continuing please choose one of them and modify your source files and your code accordingly. This guide will show you how to setup Blazorise with Bootstrap provider and FontAwesome icons.

NuGet packages

First step is to install a Bootstrap provider for Blazorise:

Install-Package Blazorise.Bootstrap

You also need to install the icon package:

Install-Package Blazorise.Icons.FontAwesome

Sources files

The next step is to change your index.html file and include the css and js source files:

<link rel="stylesheet" href="" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">

<script src="" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>


In your main _ViewImports.cshtml add:

@addTagHelper *, Blazorise

@using Blazorise


Finally in the Startup.cs you must tell the Blazor to register Bootstrap provider and extensions:

using Blazorise;
using Blazorise.Bootstrap;
using Blazorise.Icons.FontAwesome;

public void ConfigureServices( IServiceCollection services )
    .AddBlazorise() // from v0.6.0-preview4

public void Configure( IComponentsApplicationBuilder app )

  app.AddComponent<App>( "app" );

Other frameworks

To setup Blazorise for other css frameworks please refer the Usage page in the documentation.