Ignite UI for Angular — Theming Skill

Description

This skill teaches AI agents how to theme Ignite UI for Angular applications using the Sass-based theming system and the Ignite UI Theming MCP server. It covers global themes, palettes, typography, elevations, component-level theming, layout controls (spacing, sizing, roundness), and how to use the MCP tools for code generation.

Prerequisites

• An Angular project with igniteui-angular installed, or @infragistics/igniteui-angular for licensed users
• Sass support enabled in the project (default for Angular CLI projects)

Ignite UI Theming MCP Server (required)

The igniteui-theming MCP server generates production-ready theme code (create_theme, create_palette, create_component_theme, get_component_design_tokens, get_color, and more). Use its tools for all theme code — never write theme Sass or component token names from memory.

Verify the server before any other step by calling detect_platform. If the tool is not available: