AndreGoepel.Design.Blazor 1.0.1

dotnet add package AndreGoepel.Design.Blazor --version 1.0.1
                    
NuGet\Install-Package AndreGoepel.Design.Blazor -Version 1.0.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="AndreGoepel.Design.Blazor" Version="1.0.1" />
                    
For projects that support PackageReference, copy this XML node into the project file to reference the package.
<PackageVersion Include="AndreGoepel.Design.Blazor" Version="1.0.1" />
                    
Directory.Packages.props
<PackageReference Include="AndreGoepel.Design.Blazor" />
                    
Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.
paket add AndreGoepel.Design.Blazor --version 1.0.1
                    
#r "nuget: AndreGoepel.Design.Blazor, 1.0.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.
#:package AndreGoepel.Design.Blazor@1.0.1
                    
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.
#addin nuget:?package=AndreGoepel.Design.Blazor&version=1.0.1
                    
Install as a Cake Addin
#tool nuget:?package=AndreGoepel.Design.Blazor&version=1.0.1
                    
Install as a Cake Tool

AndreGoepel.Design.Blazor

An app-neutral design system for Blazor: an emerald-accented light/dark token palette, a Radzen reskin, self-hosted fonts, and a small set of shell / login building blocks. It has no dependency on any application — consume it from any Blazor app or library to get a consistent look without pulling in unrelated stacks.

Extracted from the marten-identity project, where it originated as the "AppFoundation" UI.

Install

dotnet add package AndreGoepel.Design.Blazor

Use

Reference the stylesheets after Radzen's material-base.css, and load the theme + nav scripts, in your host page (App.razor):

<link rel="stylesheet" href="_content/AndreGoepel.Design.Blazor/css/fonts.css" />
<link rel="stylesheet" href="_content/Radzen.Blazor/css/material-base.css" />
<link rel="stylesheet" href="_content/AndreGoepel.Design.Blazor/css/design.css" />
<script src="_content/AndreGoepel.Design.Blazor/js/theme.js"></script>
<script src="_content/AndreGoepel.Design.Blazor/js/nav.js"></script>

Then build with Radzen components and the ag-* helper classes, and use the shell:

<AppShell BrandName="Acme">
    <Sidebar>@* NavLinks + ag-nav-section groups *@</Sidebar>
    <TopbarActions><ThemeToggle /></TopbarActions>
    <ChildContent>@Body</ChildContent>
</AppShell>

What's inside

  • Design tokens (--ag-*) for light + dark, and a remap of Radzen's --rz-* variables onto them.
  • ag-* helper classes — cards, buttons, badges, forms, grids, empty states, the app shell, and the login card.
  • ComponentsAppShell, AppPageTitle, LoginShell, AppIcon, ThemeToggle, and the cascading BreadcrumbState.
  • Self-hosted fonts (Manrope / Space Grotesk / JetBrains Mono) — nothing is fetched from Google at runtime. Regenerate with scripts/fetch-fonts.py.

See DESIGN.md for the full guidelines.

License

MIT © André Göpel

Product Compatible and additional computed target framework versions.
.NET net10.0 is compatible.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages (2)

Showing the top 2 NuGet packages that depend on AndreGoepel.Design.Blazor:

Package Downloads
AndreGoepel.Marten.Identity.Blazor

Blazor Server UI components for AndreGoepel.Marten.Identity — login, registration, 2FA, passkeys, and user/role administration pages built with Radzen.

AndreGoepel.AppFoundation

Reusable Blazor management frontend (layout, navigation, setup, and admin shell) for AndreGoepel.AppFoundation-based applications.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
1.0.1 61 7/8/2026
1.0.0 78 7/8/2026