# Set Global Font Size

## Environment

<table>
 <tr>
  <td>Product</td>
  <td>Progress® Telerik® UI for ASP.NET MVC</td>
 </tr>
</table>

## Description

This KB article demonstrates how to adjust the global font size of the text displayed inside the Telerik UI UI for ASP.NET MVC components.

## Solution

The default font size of the components is 14px by default.

However, font sizes now operate in rem-s, and this might lead to different results depending on the environment. For instance, the default value of the **kendo-font-size** variable inside the SASS theme is 0.875rem. In some systems, this might translate to 14px, in others to 18px, and in third ones - to 12.5px.

To set the global font size in pixels, you can use one of these different options:

**Option 1:**

You can set a value like this:

```CSS
html {
    font-size: 16px;
}
```

Which will result to something like 14px in the components operating with rem units, because **kendo-font-size** is 0.875rem.

**Option 2:**

By modifying the variable you can set final value in pixels dynamically:

```CSS
html {
    --kendo-font-size: 16px;
}
```

**Option 2:**

By modifying the variable in rem-s, you can again let the pixel value unmodified:

```CSS
html {
    --kendo-font-size: 1rem;
    font-size: 16px;
}
```

And this will also result in text font size of 16px.

## See Also

* [Theme Variables](https://www.telerik.com/design-system/docs/themes/theme-default/theme-variables)
* [Themes Foundation - Typography](https://www.telerik.com/design-system/docs/foundation/typography/)
* [Themes Default - Typography](https://www.telerik.com/design-system/docs/themes/theme-default/customization/#typography)