Welcome to ShellUI v0.3.0, the stable release of the CLI-first Blazor component library inspired by shadcn/ui. It ships 76 components, Tailwind CSS 4.3.2, and everything from the 0.3.0 alphas and release candidates.

v0.3.0 — Stable76 components.NET 8, 9 & 10 (CLI)tweakcn themes

The CLI needs the .NET 10 SDK and works in Blazor projects on .NET 8, 9 and 10. The ShellUI.Components NuGet package targets .NET 10 only; on .NET 8 or 9, use the CLI.

Getting Started

Installation

Choose your preferred installation method:

CLI Installation (Recommended)

dotnet tool install -g ShellUI.CLI

# Or upgrade an existing install
dotnet tool update -g ShellUI.CLI

# Initialize in your Blazor project (safe to re-run)
shellui init

# Add components
shellui add button input card table chart drawer sheet

NuGet Package

dotnet add package ShellUI.Components

With the package, add @using ShellUI.Components to _Imports.razor, give the app an interactive render mode (for example <Routes @rendermode="InteractiveServer" />), and link _content/ShellUI.Components/shellui-all.css. See the NuGet guide.

Quick Example

<Card>
  <CardHeader>
    <CardTitle>Welcome to ShellUI</CardTitle>
    <CardDescription>Build beautiful Blazor applications</CardDescription>
  </CardHeader>
  <CardContent>
    <p>Your content goes here.</p>
  </CardContent>
</Card>

Component Categories

Explore our comprehensive component library, organized by category:

Form Components

Buttons, inputs, selects, and form controls

Layout Components

Cards, dialogs, sheets, and structural elements

Navigation Components

Menus, breadcrumbs, tabs, and navigation elements

Interactive Components

Dropdowns, tooltips, and interactive elements

Advanced Components

Calendars, charts, carousels, steppers, and complex UI elements

What's Fixed in v0.3.0

Everything from the alpha series, plus the fixes from the release candidates:

Template compilation: ChartVariants, PieChart, and DashboardLayout02 templates had uncompilable C# with improperly escaped quotes in verbatim strings — fixed. Same backslash-escaping bug fixed in the live PieChart.razor.
CSP-safe runtime: ThemeToggle, InputOTP, and ThemeService no longer use eval(). localStorage reads moved to proper Blazor lifecycle methods.
Idempotent shellui init: patches App.razor with render modes, theme bootstrap scripts, and shellui.js references. Writes the full default theme to input.css instead of just the Tailwind import. Re-running is safe.
Component install fixes: shellui add data-table now properly installs DataTableModels.cs and auto-installs NuGet dependencies (System.Linq.Dynamic.Core, Blazor-ApexCharts). Chart tooltips render readable text instead of invisible white-on-white.
CLI ergonomics: typo suggestions added (e.g. "Did you mean 'data-table'?").
SidebarTrigger: now uses inline SVG instead of FontAwesome dependency for the mobile hamburger menu.
Component count: 76 installable components; sub-components, variants and models install automatically with them.

Also in 0.3.0:

Drawer/Sheet compositional pattern: DrawerTrigger, DrawerContent, SheetTrigger, SheetContent — no external open state required
Compositional APIs across NavigationMenu, Tabs, Dropdown, Popover, Collapsible, and Accordion
Components added during alphas: Callout, CopyButton, LinkCard, PrevNextNav, Sonner, Stepper

Key Features

CLI-First: Copy components directly to your codebase for full control
Hybrid Workflow: CLI + NuGet packages for maximum flexibility
Tailwind CSS v4.3.2: Modern styling with standalone CLI (no Node.js required)
Production-Ready Components: Comprehensive component library
Type-Safe Variants: CVA patterns with full C# type safety
Accessible: WCAG 2.1 AA compliant by default
Performance Optimized: Built for both Server and WASM scenarios
Customizable: Easy theme customization with CSS variables

Architecture

ShellUI offers a unique hybrid approach:

Copy Components: Like shadcn/ui, components are copied to your project
NuGet Option: Traditional package installation for quick starts
Tailwind Integration: Standalone CLI or npm setup options
Build Integration: Automatic CSS compilation on project build

Theming

Customize your theme instantly with tweakcn or modify CSS variables:

:root {
  --background: oklch(0.9900 0 0);
  --foreground: oklch(0 0 0);
  --primary: oklch(0 0 0);
  --primary-foreground: oklch(1 0 0);
  --secondary: oklch(0.9400 0 0);
  --secondary-foreground: oklch(0 0 0);
  /* ... more variables */
}

ShellUI Documentation