A shared visual language.

A shared shell, individual contracts

Use a small set of application tokens for backgrounds, text, spacing, borders and accents. Adapt those values to each library’s public theme interface. There is no single universal stylesheet that themes every package.

:root {
  --app-background: #101215;
  --app-panel: #191c21;
  --app-text: #eef0f3;
  --app-accent: #d6ef81;
}
.workspace { background: var(--app-background); color: var(--app-text); }

Respect Shadow DOM

TreeDataGridWeb, RibbonWeb and RichTextWeb encapsulate presentation. Use supported theme attributes, CSS custom properties and exposed shadow parts. Application selectors do not cross a shadow boundary by accident.

Canvas is its own surface

DrawingWeb and SkiaSharpWeb draw into canvases. Choose drawing colors explicitly rather than expecting inherited DOM text colors to restyle pixels. The spatial playground also separates the R-tree algorithm from its Canvas 2D visualization.

Contrast and motion are part of the theme

Check contrast in both modes. Keep visible keyboard focus. Respect reduced-motion preferences and avoid encoding meaning through color alone. The showcase’s light/dark switch persists locally and never requires an account.

Component APIs and compatibility boundaries are documented in their upstream repositories. Each component page links to its own source and guide.