Customizing Typography
Variables
The following table lists the available variables for customization.
| Name | Type | Default value | Computed value |
|---|---|---|---|
| $kendo-font-size | Number | $font-size-base | 1rem |
Description
Base font size across all components. | |||
| $kendo-font-family-sans-serif | List | $font-family-sans-serif | 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 | $font-family-monospace | SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace |
Description
Font family for monospaced text. Used for styling the code. | |||
| $kendo-font-family | List | $kendo-font-family-sans-serif | 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 across all components. | |||
| $kendo-line-height | Number | $line-height-base | 1.5 |
Description
Line height used along with $kendo-font-size. | |||
