Fonts
font-kerning
font-kerning decides whether to tighten pairs such as "AV" and "To" using the kerning data in the font.
Syntax
auto | normal | nonePreview
Presets
Drag the bottom-right corner to resize
Code
.box {
font-family: Inter, sans-serif;
font-kerning: normal;
}Controls
font-kerningnormal
About
Values
auto: the browser decides whether to kern. This is the initial value. In Chrome 141, checked for this page, it behaves likenormal.normal: kerns.none: does not kern.
Kerning is meant for proportional fonts. If the font has no kerning data, no value changes anything. When letter-spacing is set, it is added on top of the kerned spacing.
So that the preview looks the same everywhere, it uses Inter, which the site already loads, as a supporting declaration. The gaps in "AV" and "To" widen with none.