Angular Material Runtime Theme

June 14, 2026 · View on GitHub

Monorepo for angular-material-runtime-theme — runtime Material Design 3 theming for Angular Material apps.

Change the primary brand color at runtime (user settings, white-labeling, accessibility themes) without recompiling Sass. The library derives M3 system tokens from one hex value using Material Color Utilities.

Projects

ProjectDescription
projects/libPublishable library (AngularMaterialRuntimeTheme)
projects/demoInteractive showcase application

Quick start

pnpm install
pnpm start

Visit http://localhost:4200 to explore the demo: color picker, preset palettes, light/dark mode, and a broad set of Angular Material components.

Build

pnpm run build:lib   # library → dist/
pnpm run build:demo  # demo app
pnpm run build       # both

Documentation

Full installation, setup, API reference, and theming notes:

projects/lib/README.md

Development

pnpm test        # Run all tests
pnpm test:compat # Run Angular version compatibility tests
pnpm lint
pnpm format

Stack

  • Angular
  • Angular Material (M3)
  • Material Color Utilities