Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time


A Blazor port of Toastr.js to Server and Webassembly Blazor Apps.

The transitions are implemented using System.Threading.Timer timers so the resource usage should be closely monitored when using the server-side hosting model.

Only for server-side projects

The static assets from Razor Component Libraries are available by default only in Development mode. They can be enabled on Production using the UseStaticWebAssets() method in the Program.cs file as in the following example:

public static IHostBuilder CreateHostBuilder(string[] args) =>
		.ConfigureWebHostDefaults(webBuilder =>


The client-side sample project has been published here.


__version 3.0.0

  • new configuration options for styling the toast title (ToastTitleClass) and message (ToastTitleClass) and an example for aligning their text to left, center or right. Thanks to @bholland314
  • new configuration option (EscapeHtml) for allowing raw HTML in title and message. Thanks to @bholland314
  • Breaking changes
    • Options reference has been removed from the Toast class

__version 2.0.0

  • update to core 3.1.100

__version 2.0.0-beta1

  • thread safety controls on the Toasts list
  • Breaking changes
    • IToaster.Toasts property removed in favor of the ShownToasts property

See the RELEASE-NOTES for the previous versions.



Add a reference to the library from NuGet Pre Release

Dependency injection configuration

using Sotsera.Blazor.Toaster.Core.Models; // Needed for the configuration objects

public class Startup
    public void ConfigureServices(IServiceCollection services)
        // Add the library to the DI system
        services.AddToaster(config =>
            //example customizations
            config.PositionClass = Defaults.Classes.Position.TopRight;
            config.PreventDuplicates = true;
            config.NewestOnTop = false;

Css inclusion

Add the following reference to the toaster css in the _Host.cshtml component for server side-apps or in the index.html file for client side-apps:

<link href="_content/Sotsera.Blazor.Toaster/toastr.min.css" rel="stylesheet" />

Main toaster component

The toast container must be added to the App.razor component or to another component always loaded in the application like MainLayout.razor. It is important to have exactly one instance of this component rendered in the application tree at any given time.

@using Sotsera.Blazor.Toaster
<ToastContainer />


In a component

@inject Sotsera.Blazor.Toaster.IToaster Toaster

In a class

protected Sotsera.Blazor.Toaster.IToaster Toaster { get; set; }

then call one of the display methods:

Toaster.Info("toast body text");
Toaster.Success("toast body text");
Toaster.Warning("toast body text");
Toaster.Error("toast body text");

Each of these methods can accept a title and an action for the toast specific configuration

Toaster.Info("toast body text");
Toaster.Info("toast body text", "toast title");
Toaster.Info("toast body text", "toast title", options =>
    options.Clicked += toast => Console.WriteLine($"Toast '{toast.Message}' Clicked!");


This is a simple attempt to port Toastr.js to Blazor.

Currently the css styles used are literally COPIED from Toastr.js.

The logo has been made by Freepik from Flaticon and is licensed by CC 3.0 BY


Sotsera.Blazor.Toaster is licensed under MIT license