Installation

Get Arcadia Controls running in your Blazor project in under 5 minutes.

Prerequisites

  • .NET 5.0 or later (recommended: .NET 9)
  • A Blazor Server, WebAssembly, or Auto project

Install Packages

Install the packages you need via NuGet. Each package is independent — only Arcadia.Core is a shared dependency.

# Charts + Dashboard Widgets (includes Core)
dotnet add package Arcadia.Charts

# Form Builder (includes Core)
dotnet add package Arcadia.FormBuilder

# Toast Notifications (includes Core)
dotnet add package Arcadia.Notifications

# Theme Engine (includes Core)
dotnet add package Arcadia.Theme

# Or install everything
dotnet add package Arcadia.Charts
dotnet add package Arcadia.FormBuilder
dotnet add package Arcadia.Notifications

Add Stylesheets

Add the CSS files to your app's <head> (in App.razor or index.html):

<!-- Theme tokens (required) -->
<link href="_content/Arcadia.Theme/css/helix.css" rel="stylesheet" />

<!-- Charts styles -->
<link href="_content/Arcadia.Charts/css/arcadia-charts.css" rel="stylesheet" />

<!-- Form styles -->
<link href="_content/Arcadia.FormBuilder/css/arcadia-forms.css" rel="stylesheet" />

<!-- Notification styles -->
<link href="_content/Arcadia.Notifications/css/arcadia-notifications.css" rel="stylesheet" />

Register Services

In your Program.cs, register the services you need:

using Arcadia.Theme;
using Arcadia.Notifications;

// Theme (required for ThemeProvider)
builder.Services.AddScoped<ThemeService>();

// Toast notifications
builder.Services.AddScoped<ToastService>();

Wrap Your App

Wrap your layout in ThemeProvider to enable theming across all components:

@using Arcadia.Theme

<ThemeProvider>
    @Body
</ThemeProvider>

Your First Component

Drop in a KPI card to verify everything works:

@using Arcadia.Charts.Components.Dashboard

<HelixKpiCard Title="Revenue"
              Value="$142,500"
              Delta="+12.3%"
              DeltaType="DeltaType.Increase"
              Sparkline="@(new double[] 62)" />
Next steps

Check out the Quick Start guide for a complete dashboard example, or dive into Charts or Forms.