What it does
A Sass theming library and MCP server for Ignite UI applications. The Sass side provides four predefined theme palettes (material, bootstrap, fluent, indigo) with light and dark variants, plus modules for typography presets and elevation shadows. The bundled MCP server enables AI assistants like Claude to generate production-ready theming code—building complete themes, color palettes with shade variants, and typography systems from natural language descriptions.
Who it's for
Frontend teams building Ignite UI applications who need consistent design tokens across their codebase. Especially useful for teams using Claude or other MCP-compatible AI assistants to accelerate theme creation, palette generation, and component customization without manual Sass authoring.
Common use cases
- Access palette colors using the
color()function with automatic shade variations - Apply typography presets via the
typography()mixin - Add consistent shadows using elevation levels 0–24 with the
elevation()function - Prompt Claude to generate a complete light/dark theme for your application
- Customize design tokens and component styling through an MCP-connected IDE
Setup pitfalls
- The MCP server requires
npm run buildfrom the repository root before the binary is available indist/mcp/ - Needs filesystem write permissions—the MCP server generates and modifies theme files in your project
- Your build pipeline must support Sass to consume the
@useimports from the package - The MCP server must be registered in your AI client config (e.g.,
.vscode/mcp.jsonfor VS Code)