BlazorDesktop 3.1.1

.NET 7.0
dotnet add package BlazorDesktop --version 3.1.1
NuGet\Install-Package BlazorDesktop -Version 3.1.1
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="BlazorDesktop" Version="3.1.1" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add BlazorDesktop --version 3.1.1
#r "nuget: BlazorDesktop, 3.1.1"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install BlazorDesktop as a Cake Addin
#addin nuget:?package=BlazorDesktop&version=3.1.1

// Install BlazorDesktop as a Cake Tool
#tool nuget:?package=BlazorDesktop&version=3.1.1

GitHub license Contributor Covenant GitHub issues

Blazor Desktop

Blazor Desktop allows you to create desktop apps using Blazor. Apps run inside of a .NET generic host with a WPF window thats fully managed using a similar template to Blazor WASM. app

Getting Started

The easiest way to get started with Blazor Desktop is to install the templates, you can do so using the dotnet cli as follows:

dotnet new --install BlazorDesktop.Templates::3.1.1

Once you have the templates installed, you can either create a new project from the template either in Visual Studio in the template picker: desktop

Or, you can create a new project using the cli as follows:

dotnet new blazordesktop -n MyBlazorApp

Tips & Tricks

The Blazor Desktop template is set up very similar to the Blazor WASM template, you can see the Program.cs file here:

using BlazorDesktop.Hosting;
using HelloWorld;
using HelloWorld.Data;
using Microsoft.AspNetCore.Components.Web;

var builder = BlazorDesktopHostBuilder.CreateDefault(args);




if (builder.HostEnvironment.IsDevelopment())

await builder.Build().RunAsync();

You can add root components just the same as well as add additional services your app may need just the same.

There are however a few additional APIs and services that have been made available to help when working in the context of a WPF window.

Window Utilities

The window can have most of its common configuration done through the BlazorDesktopHostBuilder.Window APIs before you build your app in Program.cs.

To change your window title:


Window size:


Disable window resizing:


Disable the window frame (allows you to use your own window chrome inside of Blazor):


And change your window icon (uses favicon.ico as the default, base directory is wwwroot):


It is also possible to configure these values through appsettings.json like so:

  "Window": {
    "Title": "Hello Blazor",
    "Height": 1080,
    "Width": 1920,
    "MinHeight": 720,
    "MinWidth": 1280,
    "MaxHeight": 1440,
    "MaxWidth": 2560,
    "Frame": false,
    "Resizable": false,
    "Icon": "hello.ico"
  "Logging": {
    "LogLevel": {
      "Default": "Information"

Blazor Desktop will automatically install a web view runtime for the user if they do not already have it installed, you can disable this if you wish:


The Window object itself is also made available inside of the DI container, so you can access all properties on it by using the inject Razor keyword or requesting it through the constructor of a class added as a service.

Custom Window Chrome & Draggable Regions

It is possible to make your own window chrome for Blazor Desktop apps. As an example base setup you could do the following:

Set up the window to have no frame in Program.cs:


Using the base template, if you were to edit MainLayout.razor and add a -webkit-app-region: drag; style to the top bar like so:

@inherits LayoutComponentBase

<div class="page">
    <div class="sidebar">
        <NavMenu />

        <div class="top-row px-4" style="-webkit-app-region: drag;">
            <a href="" target="_blank">About</a>

        <article class="content px-4">

The top bar becomes draggable, applying the -webkit-app-region: drag; property to anything will make it able to be used to drag the window.

In terms of handling things such as the close button, you can inject the Window into any page and interact from it there.

Here is an example changing MainLayout.razor:

@using System.Windows

@inherits LayoutComponentBase
@inject Window window

<div class="page">
    <div class="sidebar">
        <NavMenu />

        <div class="top-row px-4" style="-webkit-app-region: drag;">
            <a href="" target="_blank">About</a>

        <article class="content px-4">
            <button @onclick="CloseWindow">Close Window</button>

@code {
    void CloseWindow()


Under the hood, Blazor Desktop uses WebView2 which has limitations right now with composition. Due to this, if you disable the window border through the Window.UseFrame(false) API, the top edge of the window is unusable as a resizing zone for the window. However all the other corners and edges work.

Product Versions
.NET net7.0-windows10.0.22000
Compatible target framework(s)
Additional computed target framework(s)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories (1)

Showing the top 1 popular GitHub repositories that depend on BlazorDesktop:

Repository Stars
RGB ligting control for 3rd party devices inside of Razer Synapse.
Version Downloads Last updated
3.1.1 311 1/17/2023
3.1.0 141 1/17/2023
3.0.0 155 1/16/2023
2.0.0 162 1/14/2023
1.1.0 220 5/8/2022
1.0.5 163 2/25/2022
1.0.4 120 2/12/2022
1.0.1 94 2/9/2022
1.0.0 89 2/9/2022