https://github.com/phmatray/daisyblazor
A Tailwind CSS v4 + daisyUI v5 component library for Blazor — 60+ daisyUI-native components, a MudBlazor-compatible API, theming, dialogs, snackbars, dependency-free SVG charts, a CSS preset, and a dotnet new template.
https://github.com/phmatray/daisyblazor
blazor blazor-components csharp daisyui dotnet razor tailwindcss ui-components
Last synced: 14 days ago
JSON representation
A Tailwind CSS v4 + daisyUI v5 component library for Blazor — 60+ daisyUI-native components, a MudBlazor-compatible API, theming, dialogs, snackbars, dependency-free SVG charts, a CSS preset, and a dotnet new template.
- Host: GitHub
- URL: https://github.com/phmatray/daisyblazor
- Owner: phmatray
- License: mit
- Created: 2026-06-04T11:35:15.000Z (15 days ago)
- Default Branch: main
- Last Pushed: 2026-06-04T13:02:02.000Z (15 days ago)
- Last Synced: 2026-06-04T14:08:02.541Z (15 days ago)
- Topics: blazor, blazor-components, csharp, daisyui, dotnet, razor, tailwindcss, ui-components
- Language: HTML
- Homepage: https://phmatray.github.io/daisyblazor/
- Size: 1.77 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
🌼 DaisyBlazor
A Tailwind CSS v4 + daisyUI v5 component library for Blazor.
60+ daisyUI-native components, a MudBlazor-compatible API, theming, dialogs, snackbars,
dependency-free charts, a shippable CSS preset, and a dotnet new template.
📖 Documentation ·
Getting started ·
NuGet
---
## The problem it solves
Blazor has no first-class Tailwind/daisyUI component story. Today you usually pick one of two paths,
and both have real costs:
- **Adopt a heavyweight component framework** (MudBlazor, Radzen, …) — you inherit its design language,
its CSS runtime, and its lock-in. Restyling to match a Tailwind/daisyUI design system fights the framework.
- **Hand-roll daisyUI markup** — you write `` everywhere, then re-implement
theming, dialogs, toasts, form binding, and a Tailwind build by hand in every project.
**DaisyBlazor closes that gap:**
| Pain | DaisyBlazor |
|------|-------------|
| No native daisyUI components for Blazor | **60+ components** mapped to daisyUI's own taxonomy (Actions, Data display, Navigation, Feedback, Data input, Layout, Mockup). |
| Migrating off MudBlazor is all-or-nothing | A **MudBlazor-compatible API** (`Button`, `Card`, `Table`, `IDialogService`, `ISnackbar`, `Icons.Material.*`) — migrate incrementally by renaming `MudX` → `X`. |
| Wiring Tailwind + daisyUI + a class safelist is fiddly | A **shippable CSS preset** — one `@import` enables daisyUI, the themes, and the dynamic-class safelist. |
| Theming/dark-mode is manual | A parameter-driven **`ThemeProvider`** with **35 built-in themes** + your own, dark mode, and SSR-safe persistence. |
| Charts mean a heavy JS dependency | **Dependency-free SVG charts** that follow the active daisyUI theme — zero charting runtime. |
| Starting a new app is boilerplate | `dotnet new daisyblazor` scaffolds a wired app in seconds. |
## Quick start
Scaffold a new app:
```bash
dotnet new install DaisyBlazor.Templates
dotnet new daisyblazor -o MyApp
cd MyApp && npm install && dotnet run
```
…or add it to an existing Blazor app:
```bash
dotnet add package DaisyBlazor.Components
npm install -D tailwindcss @tailwindcss/cli daisyui
```
```csharp
// Program.cs
builder.Services.AddDaisyBlazor();
```
```css
/* Styles/main.css — Tailwind v4 source globs are one line per extension (no { } brace groups). */
@import "tailwindcss";
@import "daisyblazor/preset.css";
@source "../**/DaisyBlazor.Components/**/*.razor";
@source "../**/DaisyBlazor.Components/**/*.cs";
```
```razor
Hello DaisyBlazor
First panel
Second panel
OK
```
Full setup (CSS pipeline, fonts, DI, theming) is in **[Getting started](https://phmatray.github.io/daisyblazor/getting-started/)**.
## Packages
| Package | Version | Description |
|---|---|---|
| **DaisyBlazor.Components** | [](https://www.nuget.org/packages/DaisyBlazor.Components) | The component kit: daisyUI-native components + MudBlazor-compatible surface, `ThemeProvider`, dialog/snackbar services, and the CSS preset. |
| **DaisyBlazor.Charts** | [](https://www.nuget.org/packages/DaisyBlazor.Charts) | Dependency-free SVG charts (line, area, bar, pie/donut, sparkline) themed by daisyUI. |
| **DaisyBlazor.Templates** | [](https://www.nuget.org/packages/DaisyBlazor.Templates) | `dotnet new daisyblazor` starter template. |
| **@daisyblazor/tailwind** | — | npm package shipping the Tailwind/daisyUI preset for non-.NET build pipelines. |
## Screenshots
Data display — cards, table, stats, timeline, chat, carousel…
Charts — dependency-free SVG, theme-aware
Data input — inputs, select, range, rating, validation…
Theming — 35 daisyUI themes, light & dark
Run the live gallery yourself: `dotnet run --project samples/DaisyBlazor.Gallery`.
## Repo layout
```
src/ DaisyBlazor.Components, DaisyBlazor.Charts, DaisyBlazor.Tailwind
samples/ DaisyBlazor.Gallery — a runnable showcase of every component
templates/ DaisyBlazor.Templates — dotnet new template
website/ Astro Starlight documentation site (GitHub Pages)
tests/ bUnit component tests
docs/ markdown source for the docs site
scripts/ update-deps, build-css, pack
```
## Documentation
📖 ****
- [Getting started](https://phmatray.github.io/daisyblazor/getting-started/) — install, CSS wiring, DI, fonts.
- [Theming](https://phmatray.github.io/daisyblazor/theming/) — `ThemeProvider`, built-in & custom themes.
- [CSS preset](https://phmatray.github.io/daisyblazor/css-preset/) — what `preset.css` ships and how to wire `@source`.
- [Component reference](https://phmatray.github.io/daisyblazor/components/) — every component by daisyUI category.
- [Charts](https://phmatray.github.io/daisyblazor/charts/) — the dependency-free SVG charts.
- [Migrating from MudBlazor](https://phmatray.github.io/daisyblazor/migration/) — the `MudX` → `X` map.
## Contributing & releasing
See [CONTRIBUTING.md](CONTRIBUTING.md) for the branch strategy (`main` / `release` / feature branches)
and the automated release pipeline.
## License
[MIT](LICENSE)