SegmentedControl Appearance
The SegmentedControl provides predefined appearance options such as different sizes and border radii. If you omit an appearance property, the active Kendo theme supplies its default value. To control how item widths are distributed, see Layout Mode.
Apart from the default vision of the SegmentedControl, these alternative styling options enable you to configure each individual aspect of the appearance of a SegmentedControl.
The following example demonstrates all the available appearance options of the SegmentedControl in a single, configurable demo.
Size
The KendoReact SegmentedControl enables you to configure the size of its items by using the size property.
The size option supports the following values:
xssmallmediumlarge
The following example demonstrates how to define the size of the SegmentedControl.
Roundness
The SegmentedControl provides the rounded property that enables you to control the border radius of the component. The theme applies the matching border radius to the selection indicator and the items, so they stay aligned with the outer edge of the component.
The rounded option supports the following values:
nonesmallmediumlargefull