How do I install the Kendo Angular Layout skill?

Run npx skillmds@latest add telerik/kendo-angular-layout in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Kendo Angular Layout safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Kendo Angular Layout?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Kendo Angular Layout free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Kendo Angular Layout?

telerik (@telerik) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Kendo Angular Layout by telerik — Agent Skill

Name: Kendo Angular Layout
Author: telerik

Kendo Angular Layout

Retrieves Kendo Design System CSS utility classes for building layouts in Kendo UI for Angular applications. Use when the user wants to build a page layout, create sections, add spacing, use flexbox/grid utilities, structure a dashboard, or needs layout-related CSS classes. Trigger on "build layout", "add spacing", "flexbox utilities", "grid layout", "Kendo CSS utils", "layout structure", "responsive layout", "page sections". Always call before writing custom CSS for layout purposes.

telerik 8b3389c 2 files · 7.4 KB Updated Sep 17, 2026

File contents

Kendo UI for Angular — Layout Assistant

Setup

Before using layout utilities, read layout-conventions.md for setup instructions, critical Angular sizing rules, and ready-to-use layout components.

Calling the Layout Assistant

Use the kendo_layout_assistant MCP tool to retrieve Kendo Design System CSS utility classes relevant to your layout requirements.

Tool call:

kendo_layout_assistant({
    prompt="<Detailed description of the layout: sections, structure, responsive needs, component types>",
    includeBuildingBlockExamples=true  // Set to true to include example building blocks
})

Examples:

kendo_layout_assistant({
    prompt="Provide Kendo Design System utility classes for a dashboard layout with a header, sidebar navigation, main content area with cards, and a footer. Needs to be responsive across mobile and desktop.",
    includeBuildingBlockExamples=true
})

kendo_layout_assistant({
    prompt="Provide Kendo Design System utility classes to make a 3-column card grid responsive — stacked on mobile, 2 columns on tablet, 3 columns on desktop."
})

Query Guidelines

Be descriptive. Include all sections (header, sidebar, content area, footer), the component types used, and responsive requirements.
One layout call per major section if sections have different requirements.
Always call this tool before writing custom CSS for layout — the utility classes cover most layout scenarios.
For responsive adjustments, make a separate call with the responsive requirements described.
Check layout-conventions.md for Angular-specific rules (e.g., min-width: 0 on flex children, explicit [height] binding for Grid and Chart).

---name: kendo-angular-layoutdescription: Retrieves Kendo Design System CSS utility classes for building layouts in Kendo UI for Angular applications. Use when the user wants to build a page layout, create sections, add spacing, use flexbox/grid utilities, structure a dashboard, or needs layout-related CSS classes. Trigger on "build layout", "add spacing", "flexbox utilities", "grid layout", "Kendo CSS utils", "layout structure", "responsive layout", "page sections". Always call before writing custom CSS for layout purposes.---## Kendo UI for Angular — Layout Assistant### SetupBefore using layout utilities, read [layout-conventions.md](layout-conventions.md) for setup instructions, critical Angular sizing rules, and ready-to-use layout components.### Calling the Layout AssistantUse the `kendo_layout_assistant` MCP tool to retrieve Kendo Design System CSS utility classes relevant to your layout requirements.**Tool call:**```kendo_layout_assistant({ prompt="<Detailed description of the layout: sections, structure, responsive needs, component types>", includeBuildingBlockExamples=true // Set to true to include example building blocks})```**Examples:**```kendo_layout_assistant({ prompt="Provide Kendo Design System utility classes for a dashboard layout with a header, sidebar navigation, main content area with cards, and a footer. Needs to be responsive across mobile and desktop.", includeBuildingBlockExamples=true})``````kendo_layout_assistant({ prompt="Provide Kendo Design System utility classes to make a 3-column card grid responsive — stacked on mobile, 2 columns on tablet, 3 columns on desktop."})```### Query Guidelines- **Be descriptive.** Include all sections (header, sidebar, content area, footer), the component types used, and responsive requirements.- **One layout call per major section** if sections have different requirements.- Always call this tool **before** writing custom CSS for layout — the utility classes cover most layout scenarios.- For responsive adjustments, make a separate call with the responsive requirements described.- Check [layout-conventions.md](layout-conventions.md) for Angular-specific rules (e.g., `min-width: 0` on flex children, explicit `[height]` binding for Grid and Chart).

Frequently asked questions