Kendo UI for Angular SegmentedControl Overview
Updated on Mar 27, 2026
The Kendo UI for Angular SegmentedControl renders a group of buttons where only one can be selected at a time. A sliding selection indicator highlights the active item.
Use the SegmentedControl to let users choose between a small set of mutually exclusive options, for example, switching between profile types or view modes.
Start Free Trial
The following example demonstrates the SegmentedControl in action.
Change Theme
Theme
Loading ...
Key Features
- Binding Items—Define the collection of items rendered by the SegmentedControl.
- Selected Item—Control which item is selected and use two-way binding.
- Appearance—Configure the size of the SegmentedControl to fit your design requirements.
- Disabled Items—Disable individual items to prevent user interaction.
- Layout Mode—Switch between compact and stretch layout modes to control how items are sized.
- Icon Options—Display SVG or font icons inside each item of the SegmentedControl.
- Events—Handle the selection change event to execute custom logic.
- Globalization—All Kendo UI for Angular Buttons provide globalization options.
To learn more about the appearance, anatomy, and accessibility of the SegmentedControl, visit the Progress Design System documentation—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
Support and Learning Resources
- SegmentedControl Homepage
- Getting Started with the Kendo UI for Angular Buttons
- API Reference of the SegmentedControl
- Getting Started with Kendo UI for Angular (Online Guide)
- Getting Started with Kendo UI for Angular (Video Tutorial)
- Video Courses
- Before You Start: All Things Angular (Telerik Blog Post)
- Knowledge Base