WaxComponents 0.9.10
The repository is moved to WaxUI
dotnet add package WaxComponents --version 0.9.10
NuGet\Install-Package WaxComponents -Version 0.9.10
<PackageReference Include="WaxComponents" Version="0.9.10" />
<PackageVersion Include="WaxComponents" Version="0.9.10" />
<PackageReference Include="WaxComponents" />
paket add WaxComponents --version 0.9.10
#r "nuget: WaxComponents, 0.9.10"
#:package WaxComponents@0.9.10
#addin nuget:?package=WaxComponents&version=0.9.10
#tool nuget:?package=WaxComponents&version=0.9.10
WaxComponents
A UI component library for Blazor, built with Tailwind CSS and light/dark mode support.
- NuGet: https://www.nuget.org/packages/WaxComponents
- Source: https://github.com/lllggghhhaaa/WaxComponents
- License: Apache-2.0
- Target: .NET 11.0
Components: Accordion, Alert, Avatar, Badge, Breadcrumb, Button, Card, Checkbox, Chip, Channel Button, Color Picker, Date Picker, Dialog, Drop Overlay, Dropzone, Empty State, Fab, Icon Button, Navigation (Sidebar, Server Button), Popover, Progress, QR Code, Radio, Reaction Chip, Section Heading, Select, Setting Row, Slider, Spoiler, Switch, Tabs, Text Field.
Install
dotnet add package WaxComponents
Setup
Register the services in Program.cs:
builder.Services.AddWaxComponents();
Add the stylesheet and theme support to App.razor:
<link rel="stylesheet" href="_content/WaxComponents/app.css" />
<FontMap />
<ThemePreloader />
Usage
<WaxButton Variant="WaxButtonVariant.Filled" OnClick="OnClick">
<ChildContent>Click me</ChildContent>
</WaxButton>
<WaxBadge Color="WaxColor.Primary">New</WaxBadge>
<WaxSwitch Label="Dark mode" />
private void OnClick() { }
Custom colors
Components that accept a WaxColor (Badge, Progress Bar, Slider) also accept custom theme tokens and explicit CSS colors:
@code {
// Resolved as var(--brand); define --brand in your theme.
private static readonly WaxColor Brand = new("brand");
// Any CSS color value works.
private static readonly WaxColor BrandHex = WaxColor.Custom("#7B5EA7");
}
<WaxBadge Color="Brand">Brand</WaxBadge>
<WaxBadge Color="BrandHex">Custom hex</WaxBadge>
Filled custom tokens use --{token}-foreground when defined; otherwise white is used for the text.
Theming
Inject IThemeService to change the theme at runtime:
@inject IThemeService Theme
<button @onclick="() => Theme.ToggleDarkLightAsync()">Toggle theme</button>
Modes: ThemeMode.System, ThemeMode.Light, ThemeMode.Dark.
| Product | Versions Compatible and additional computed target framework versions. |
|---|---|
| .NET | net11.0 is compatible. |
-
net11.0
- LucideBlazor (>= 1.0.7)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
| Version | Downloads | Last Updated | |
|---|---|---|---|
| 0.9.10 | 126 | 11/2/2026 | |
| 0.9.9 | 107 | 10/27/2026 | |
| 0.9.8 | 101 | 10/27/2026 | |
| 0.9.7 | 78 | 10/25/2026 | |
| 0.9.6 | 64 | 10/24/2026 | |
| 0.9.5 | 63 | 10/22/2026 | |
| 0.9.3 | 77 | 10/20/2026 | |
| 0.9.1 | 73 | 10/14/2026 | |
| 0.9.0 | 111 | 8/31/2026 | |
| 0.2.7 | 533 | 2/19/2023 | |
| 0.2.6 | 444 | 2/11/2023 | |
| 0.2.5 | 474 | 12/28/2022 | |
| 0.2.4 | 484 | 12/28/2022 | |
| 0.2.3 | 485 | 12/28/2022 | |
| 0.2.2 | 503 | 12/17/2022 | |
| 0.2.1 | 482 | 12/17/2022 | |
| 0.2.0 | 462 | 12/17/2022 | |
| 0.1.1 | 484 | 11/28/2022 | |
| 0.1.0 | 491 | 11/27/2022 |