CSS font-kerning Property

❮ Prev Next ❯

The font-kerning property controls the use of the kerning information stored in a font. Kerning defines the spacing of the letters.

Kerning specifies how the letters are spaced. It makes character spacing more pleasant to the eye and easier to read.

Initial Value	auto
Applies to	All elements. It also applies to ::first-letter and ::first-line.
Inherited	Yes.
Animatable	No.
Version	CSS3
DOM Syntax	object.style.fontKerning = "none";

Syntax

font-kerning: auto | normal | none;

Example of the font-kerning property:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      div {
        font-family: serif;
        font-size: 20px;
      }
      div.example1 {
        font-kerning: normal;
      }
      div.example2 {
        font-kerning: auto;
      }
    </style>
  </head>
  <body>
    <h2>Font-kerning property example</h2>
    <div class="example1">The text is with font kerning.</div>
    <div class="example2">The text is without font kerning.</div>
  </body>
</html>

Try it Yourself »

Values

Value	Description
auto	It depends on the browser if font-kerning should be set or not. This is the default value of the property.
normal	Sets the font kerning.
none	Does not set the font kerning.