Asgard
Documentation

Asgard

Getting started

Theming

Guides

Layout

Docking

Inputs & forms

Button

Switch

Checkbox

Radio

Select

Slider

TextBox

Upload

ImageCropper

Pickers

Color picker

Calendar

Time picker

DateTime input

Data display

Card

Accordion

Typography

Progress

DataTable

TreeView

SyntaxColor

MarkdownRenderer

Terminal

Layout & docking

Grid

Splitter

SDiv

Dock

Theme switcher

Media query

Feedback & overlays

Alert

Toast

Tooltip

Popups

Drawer

FloatingPanel

FloatingWindow

Navigation & chrome

Breadcrumb

Stepper

Toolbar

Ribbon

ContextMenu

FeatureTour

Documentation

Asgard

Getting started

Theming

Guides

Layout

Docking

Inputs & forms

Button

Switch

Checkbox

Radio

Select

Slider

TextBox

Upload

ImageCropper

Pickers

Color picker

Calendar

Time picker

DateTime input

Data display

Card

Accordion

Typography

Progress

DataTable

TreeView

SyntaxColor

MarkdownRenderer

Terminal

Layout & docking

Grid

Splitter

SDiv

Dock

Theme switcher

Media query

Feedback & overlays

Alert

Toast

Tooltip

Popups

Drawer

FloatingPanel

FloatingWindow

Navigation & chrome

Breadcrumb

Stepper

Toolbar

Ribbon

ContextMenu

FeatureTour

Layout & docking

Swap the active theme at runtime.

Asgard is fully themeable: wrap a subtree in ThemeProvider and every component inside reads the active theme. Switching the theme object re-themes everything instantly, no per-component work.

The panel below swaps between the built-in themes live.

Loading preview…
When to use it
  • Light / dark / brand theme toggles
  • Per-section theming
  • Theme editors and previews
Presets