v0.2.0 · Tailwind CSS v4

Tailwind CSS for Blazor,
zero‑config

Auto-downloads the CLI. Compiles CSS at build time. Runs watch mode in dev. One package, one line of code.

$ dotnet new blazor-tailwind -n MyApp

$ dotnet add package TailwindBlazor

Get Started GitHub

Quick Start

Two ways to get started. Both under a minute.

Recommended

Project Template

terminal

$ dotnet new install TailwindBlazor.Templates
$ dotnet new blazor-tailwind -n MyApp
$ cd MyApp && dotnet run

Everything pre-configured — Tailwind CSS, entry point, stylesheet link, and UseTailwind(). Supports --interactivity (server, webassembly, auto, none) and --Framework (net8.0, net9.0, net10.0).

Or add to an existing project

Install the package

terminal

$ dotnet add package TailwindBlazor

Create your CSS entry point

Styles/app.css

@import "tailwindcss";

Register the service and reference the CSS

Program.cs

using TailwindBlazor;

var builder = WebApplication.CreateBuilder(args);
builder.UseTailwind();

App.razor

<link rel="stylesheet" href="css/tailwind.css" />

That's it. Run dotnet build and the CLI downloads automatically, generates your CSS. In dev, dotnet watch starts watch mode for instant rebuilds.

How it works

No Node.js. No npm. Just the .NET workflow you already know.

Auto CLI Download

Detects your OS and architecture, downloads the correct Tailwind CLI binary, and caches it at ~/.tailwindblazor/cli/. Subsequent builds skip the download.

MSBuild Integration

CSS generation happens at build time through native MSBuild targets. Works with dotnet build, dotnet publish, and your IDE.

Watch Mode

A hosted service runs tailwindcss --watch in development. Edit a .razor file, CSS updates instantly.

Fully Configurable

Sensible defaults that work immediately. Override input/output paths, CLI version, or minification via MSBuild properties, C# options, or appsettings.json.

Supported Platforms

The correct CLI binary is resolved automatically.

Windows

x64

macOS

x64 / ARM64

Linux