Loading bar UI for Client-Side Blazor application.
Switch branches/tags
Clone or download


Blazor LoadingBar NuGet Package


This is a class library that inserts loading bar UI automatically into a client side Blazor application.


This is a porting from angular-loading-bar (except spinner UI).

How to install and use?

Step.1 Install the library via NuGet package, like this.

> dotnet add package Toolbelt.Blazor.LoadingBar

Step.2 Register "LoadingBar" service into the DI container, at ConfigureService method in the Startup class of your Blazor application.

using Toolbelt.Blazor.Extensions.DependencyInjection; // <- Add this, and...
public class Startup
  public void ConfigureServices(IServiceCollection services)
    services.AddLoadingBar(); // <- Add this line.

Step.3 Install "LoadingBar" service to loading bar UI works well, at Configure method in the Startup class of your Blazor application.

public void Configure(IBlazorApplicationBuilder app)
  app.UseLoadingBar(); // <- Add this line.

That's all.

After doing those 3 step, you can see a loading bar effect on your Blazor application UI, during HttpClient request going on.


Credit goes to chieffancypants for his great works angular-loading-bar.

This library includes many codes, style sheet definition, and algorithms derived from angular-loading-bar.


Mozilla Public License Version 2.0