Getting Started with Kendo UI for Angular

Updated on Apr 2, 2026

Get up and running with Kendo UI for Angular - scaffold a project in just a few steps, then explore the most popular components to start building your UI.

ninja-iconKendo UI for Angular is a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.Start Free Trial

Quick Start

Set up your first Kendo UI for Angular project and start building in minutes. Use the Kendo CLI for fast command-line scaffolding (recommended), or the VS Code Extension for a visual, wizard-driven experience with full customization:

Create a Project with the Kendo CLI

The Kendo CLI generates ready-to-run Angular CLI projects with JavaScript or TypeScript.

  1. Install the CLI globally:

    sh
    npm i -g @progress/kendo-cli
  2. Configure the MCP server for your IDE and set up your Telerik license:

    sh
    npx kendo angular setup
  3. Generate a new project by running the preferred command in the terminal:

    sh
    npx kendo angular create aba kendo-angular-app 
  4. Navigate to the project and start the dev server:

    sh
    cd kendo-angular-app && npm i
    ng serve

Now that you have created your first Kendo UI for Angular project and set up the Kendo UI for Angular MCP server, you can use the Agentic UI Generator in your IDE to add and customize components with natural language.

prompt
#kendo_ui_generator Create an area chart with time data using date/time axis and enabled zooming.

For a full list of example prompts, see the Agentic UI Generator Prompt Library.

Create a Project with the VS Code Extension

Use the Kendo UI Productivity Tools extension for VS Code to scaffold a project from a template wizard.

  1. Install the extension from the Visual Studio Marketplace

  2. Open the VS Code Command Palette (Ctrl/Command + Shift + P) and type "Kendo UI Template Wizard".

  3. Set the project name and path, choose Kendo UI for Angular as the project type and select a Theme (Default, Bootstrap, Material, or Fluent).

  4. Click Create Project, then install dependencies and run:

    sh
    npm i && ng serve -o

The extension also provides code snippets (type kr- in your editor) and a scaffolding tool for generating complex components like Charts, Forms, and Schedulers.

Have an Existing Project?

If you want to add any Kendo UI for Angular component to an existing project, follow the steps below:

  1. Add the required package and preferred Kendo theme:

    sh
    ng add @progress/kendo-angular-dateinputs --theme=default
  2. Add the component to your template:

    html
    <kendo-calendar></kendo-calendar>

Next Steps

We are sure that you are looking for more - browse the components section and discover the amazing features that Kendo UI for Angular brings to the table.

Happy coding!

Data Grid
UI Component
Transform data into interactive experiences with powerful sorting, filtering, paging, and editing built right in.
Charts
UI Component
Turn complex datasets into stunning visual stories with 70+ customizable chart types and real-time updates.
Form
UI Component
Build robust forms effortlessly with automatic validation, field management, and seamless data handling.
AI Tools
Productivity Tools
Build UIs faster than ever - just describe what you need, and watch AI generate production-ready components instantly.
VS Code Extension
Productivity Tools
Boost your productivity with instant project scaffolding, smart snippets, and one-click component generation right in your editor.
Progress Design System
Productivity Tools
Create pixel-perfect, accessible interfaces with ready-to-use Figma kits and comprehensive design patterns.
In this article
Quick StartHave an Existing Project?Next Steps
Not finding the help you need?
Contact Support