Customizing Radii

Variables

The following table lists the available variables for customization.

Name	Type	Default value	Computed value
$kendo-border-radius-none	Number	`map.get($kendo-spacing, 0)`	`0px`
Description The none border radius used across the Components.
$kendo-border-radius-xs	Number	`map.get($kendo-spacing, 1px)`	`1px`
Description The extra small border radius used across the Components.
$kendo-border-radius-sm	Number	`map.get($kendo-spacing, 0.5)`	`0.125rem`
Description The small border radius used across the Components.
$kendo-border-radius-md	Number	`map.get($kendo-spacing, 1)`	`0.25rem`
Description The medium border radius used across the Components.
$kendo-border-radius-lg	Number	`map.get($kendo-spacing, 2)`	`0.375rem`
Description The large border radius used across the Components.
$kendo-border-radius-xl	Number	`map.get($kendo-spacing, 3)`	`0.5rem`
Description The extra large border radius used across the Components.
$kendo-border-radius-xxl	Number	`map.get($kendo-spacing, 4)`	`0.75rem`
Description The third largest border radius used across the Components.
$kendo-border-radius-xxxl	Number	`map.get($kendo-spacing, 5)`	`1rem`
Description The second largest border radius used across the Components.
$kendo-border-radii	Map	`$_default-border-radii`	`(none: 0px, xs: 1px, sm: 0.125rem, md: 0.25rem, lg: 0.5rem, xl: 0.75rem, xxl: 1rem, xxxl: 1.25rem)`
Description The global radii Map.
$kendo-border-radius-full	Number	`9999px`	`9999px`
Description The largest border radius used across the Components.