Material Design 3.0 Theming Architecture

MaterialControl and the static ThemeManager implement a Material Design 3.0 token system. All colors come from the active SkiaTheme, which components read while drawing.

Color Tokens

Primary / OnPrimary / PrimaryContainer / OnPrimaryContainer: Brand color and its content pairs.
Secondary / Tertiary: Supporting accents with their container and content pairs.
Surface / OnSurface: Background and text colors for cards, dialogs and sheets.
SurfaceVariant / SurfaceContainer / SurfaceContainerHigh: Layered container backgrounds.
Outline / OutlineVariant: Borders and separators.
Error / OnError / ErrorContainer: Error states and validation.
CanvasBackground / GridColor: Diagram canvas and grid rendering.

Theme Management

ThemeManager.Current holds the active SkiaTheme (default: SkiaTheme.Light).
ThemeManager.ApplyTheme(name) switches to a built-in theme: Light, Dark, HighContrast, Nord, Dracula.
ThemeManager.ThemeChanged notifies hosts to redraw after a theme switch.
DiagramDto.ThemeName persists the active theme with the diagram, and LoadFromDto() re-applies it on load.

State Layers and Elevation

Interactive controls composite Material state layers over their base color: hover at 8% opacity, focus and pressed at 12%, and dragged at 16%. Elevation (0–5) drives drop-shadow rendering in MaterialControl.DrawContent.

MaterialControl Surface

Member	Type	Description
`Elevation`	`float`	Depth level used for shadow rendering.
`SvgIcon`	`string`	Optional SVG markup drawn as the control's icon.
`MaintainAspectRatio`	`bool`	Preserves the icon's aspect ratio when scaling.
`InvalidateVisual()`	`virtual void`	Marks the control as needing a repaint; call after changing visual properties.
`RefreshVisual()`	`void`	Public wrapper that invalidates the visual, for hosts and demos.
`Clicked`	`event EventHandler`	Raised when the control is activated.

Colors resolve through the active theme at draw time, so a control never stores theme colors itself. Per-component overrides use the component's own properties (for example CustomFillColor/CustomStrokeColor on flowchart nodes); application-wide changes go through ThemeManager.Current.

MaterialDesignColors

For cases where a color is needed outside a themed control, the static MaterialDesignColors class exposes the default MD3 palette as readonly tokens: the primary, secondary, tertiary and error families with their containers and content pairs, the surface tokens, and Outline/OutlineVariant.

var primary = MaterialDesignColors.Primary;
var surface = MaterialDesignColors.Surface;
var outline = MaterialDesignColors.Outline;

Border Rendering

Themed controls use the BorderStyle enumeration with four values: None, Single, Fixed3D and FixedSingle. Styles resolve to pre-computed SKPaint configurations for performance.