I built shadcn/ui for Blazor, and version 0.4.0 is out

Shewart — Tue, 10 Nov 2026 13:07:46 +0000

I'm Shewart, a .NET developer in Harare, Zimbabwe. Every time I started a Blazor app, I hit the same wall: the React world had shadcn/ui, beautiful, accessible components you copy into your project and own. Blazor had great component libraries, but making them look like my app meant fighting their CSS.

So I built ShellUI: shadcn/ui for Blazor. Version 0.4.0 just went stable.

How it works

dotnet tool install -g ShellUI.CLI
shellui init
shellui add button card dialog

init sets up Tailwind CSS and a theme, and wires everything into your project. add copies the components, and everything they depend on, into Components/UI. They're plain .razor files: your code, to change however you like.

<Card>
    <CardHeader>
        <CardTitle>Welcome back</CardTitle>
    </CardHeader>
    <CardContent>
        <Button Variant="ButtonVariant.Outline">Cancel</Button>
        <Button>Save</Button>
    </CardContent>
</Card>

No Node.js

Tailwind usually means npm. ShellUI downloads Tailwind's standalone binary once per machine and adds a build step, so dotnet build builds your CSS. Nothing to install, nothing to keep in sync.

Whole pages, not just components

shellui init --dashboard 02

That gives you a full dashboard layout, with a collapsible sidebar whose links come from your app's actual pages. If your app uses ASP.NET Core Identity, one more command restyles every sign-in, sign-up and account-recovery page:

shellui add auth-02

What's in 0.4.0

93 components, from buttons and dialogs to charts, a data table, a command palette, date pickers, sheets and toasts. shellui add all installs the lot.
An AI chat kit: chat, streaming messages, prompt suggestions, a collapsible reasoning block and tool-call cards:

  <Reasoning Text="@thinking" IsStreaming="@isStreaming" />
  <ToolCall Name="search_orders" State="running" Arguments="@args" />

Your classes win. A component's Class now overrides its own styles, like tailwind-merge in React. No more !important tricks:

  <Button Class="px-8 bg-destructive">Delete</Button>

Updates that respect your edits. shellui update rewrites components from newer templates but skips files you've changed. When a component's API changes, shellui migrate rewrites your own pages and shows you the diff first.
shellui doctor checks your setup (Tailwind, the host page, render mode, missing files) and tells you how to fix each problem.
Keyboard focus stays inside open dialogs, sheets and drawers.
.NET 8, 9 and 10 for both the CLI and the package.

Themes and dark mode

Every component reads CSS variables, so dark mode works out of the box, and any theme from tweakcn works too:

shellui theme apply https://tweakcn.com/themes/<theme-id>

Prefer a package?

If you'd rather not own the source, the same components ship as one NuGet package, with a precompiled stylesheet so you don't need Tailwind at all:

dotnet add package ShellUI.Components

Try it

ShellUI is free and MIT-licensed.

📘 Docs and live examples: shellui.dev
⭐ Source: github.com/shellui-dev/shellui

It's pre-1.0, so APIs can still change between minor versions; that's what shellui migrate is for. If you build with Blazor, I'd love to hear what's missing, what breaks, and what you'd want next. Issues and PRs are open, and a star genuinely helps other people find it.

Thanks for reading! 🙏

DEV Community: Shewart