Customizing Typography

Variables

The following table lists the available variables for customization.

Name	Type	Default value	Computed value
$kendo-font-size-xs	Number	`.75rem`	`0.75rem`
Description Base font size across all components.
$kendo-font-family-sans-serif	List	`system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"`	`system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"`
Description Font family for text.
$kendo-font-family-monospace	List	`SFMono-Regular, Menlo, Monaco, Consolas, "Roboto Mono", "Ubuntu Mono", "Lucida Console", "Courier New", monospace`	`SFMono-Regular, Menlo, Monaco, Consolas, "Roboto Mono", "Ubuntu Mono", "Lucida Console", "Courier New", monospace`
Description Font family for monospaced text. Used for styling the code.
$kendo-font-family	Null	`null`	`null`
Description Font family across all components.
$kendo-line-height-sm	Number	`1.25`	`1.25`
Description Line height used along with $kendo-font-size.