@progress/kendo-angular-mcp

Kendo UI for Angular MCP Server

The Kendo UI for Angular MCP Server enables you to achieve integration with your already existing AI workflows and reach new levels of developer productivity. The MCP server provides proprietary context to AI-powered IDEs, apps and tools. You can use the Kendo UI for Angular MCP server to ask about Kendo UI for Angular components, features, or general usage. You can successfully prompt more complex questions and tasks, and generate tailored code that includes Kendo UI for Angular components and API.

As of version 1.4 the Kendo UI for Angular MCP server automatically recognizes your Telerik license and activates the Agentic UI Generator and the available assistants:

• Agentic UI Generator—Includes all five specialized assistants (Component, Layout, Styling, Icon and Accessibility), coordinated by a comprehensive orchestrator designed for complete UI generation.

Agentic UI Generator Intended Use

• Create Individual Components: Build specific Kendo UI for Angular components with particular configurations and features like filtering, validation, and data binding.
• Create Full Responsive Pages
  • Build complete dashboards, landing pages, and listing pages in existing applications.
  • Generate pages similar to the Progress Design System page templates.
• Modify Existing Pages: Generate new themes inside existing applications. Add dark mode or high-contrast themes.
• Implement Responsive Layout
  • Create new responsive pages and sections.
  • Convert existing pages to be responsive for mobile and tablet views.

Prerequisites

To use the Kendo UI for Angular MCP server, you need:

• A compatible MCP client (IDE, code editor or app) that supports MCP tools.
• An active Telerik Subscription license that provides access to the Kendo UI for Angular MCP server.

Installation

Use the Kendo CLI and the built-in Getting Started Assistant to handle the entire setup automatically - whether you are starting a new project or adding Kendo UI for Angular to an existing one.

Follow these steps to set up the Agentic UI Generator and use it in your IDE (VS Code or another supported AI-enabled IDE):

• Open your terminal and install the Kendo CLI globally:

  npm i -g @progress/kendo-cli
  

• Configure the Kendo UI for Angular MCP server for your IDE and set up your Telerik license in a single step with the Kendo CLI:

  npx kendo angular setup
  

  You are now ready to generate components and pages using the Agentic UI Generator in your IDE.

• Create a new empty folder for your project and open it in your IDE. Then, in the AI chat interface, invoke the Getting Started Assistant:

  #kendo_getting_started_assistant create a new Angular project
  

Usage

To increase the probability of the Kendo UI for Angular MCP Server being used, or to call it without the need to mention "kendo" explicitly, add custom idea instructions to your AI-powered tool. Here are examples for GitHub Copilot and Cursor.

Agentic UI Generator

To use the Agentic UI Generator mode:

• Open the AI chat interface in your IDE—Start a new chat session to begin interacting with the Agentic UI Generator.
• Start your prompt with #kendo_ui_generator (the main MCP tool to start the agentic workflow in the Agentic UI Generator).
• This will trigger an agentic workflow using the other available MCP tools to retrieve relevant context based on your prompt.
• Inspect the output and verify that the Kendo UI for Angular MCP Server is used. Look for a statement in the output, which is similar to:
  • Running kendo-angular-mcp-server (in VS Code)
  • Calling MCP tool kendo-angular-mcp-server (in Cursor)
• If requested, grant the Kendo UI for Angular MCP server a permission to run for this session, workspace, or always.

Also check more useful documentation about how to use the Agentic UI Generator here:

• Getting Started
• Use Cases
• Best Practices for more usage tips.
• Prompt Library

AI Tools Usage

The Kendo UI for Angular MCP server and its tools are offered as a single experience through the Agentic UI Generator (#kendo_ui_generator) in all active Telerik subscription models.

• License Requirements
• Usage Limits