New to KendoReactLearn about KendoReact Free.

Appearance

Updated on Apr 2, 2026

The SegmentedControl provides a set of built-in options to control its visual presentation.

SegmentedControl Size

The SegmentedControl provides the size property that enables you to control how big or small the rendered control will be.

The available size options are:

  • small
  • medium (default)
  • large
Change Theme
Theme
Loading ...

SegmentedControl Icons

Each item in the SegmentedControl accepts the svgIcon property to display an SVG icon. You can combine icons with text, use icons alone (with a title for accessibility), or render text-only items.

Change Theme
Theme
Loading ...

SegmentedControl Icon Class

The iconClassName property applies a custom CSS class to the icon element only when the item is selected. This allows you to style the active icon differently from unselected ones—for example, changing its color or applying a transform.

The following demo shows how selecting an item applies a custom CSS class that changes the icon color of the active segment:

Change Theme
Theme
Loading ...