What is kerning?
Kerning is the adjustment of space between two particular letters, so that a word looks evenly spaced to the eye. Try it: fix the word below, then compare your version with the type designer’s.
Why some letter pairs need kerning
Letters are designed as boxes with fixed side spaces. That works for most combinations, but diagonal and overhanging shapes (A, V, W, Y, T, L, and lowercase after T or V) leave extra air when they meet. Without kerning, “AVATAR” reads as “A V A T A R”. Font designers store hundreds or thousands of kerning pairs in the font file, and software applies them automatically.
Kerning vs tracking vs leading
| Term | What it changes | CSS |
|---|---|---|
| Kerning | Space between one specific pair of letters | font-kerning |
| Tracking | Even spacing across a whole run of text | letter-spacing |
| Leading | Vertical distance between lines | line-height |
When to kern by hand
- Logos and headlines: at large sizes every gap is visible. Automatic kerning is a starting point, not the finish.
- All caps: capitals need looser tracking (about 5–10%) and careful pair kerning.
- Mixed fonts or numbers: figures and punctuation often have less kerning data than letters.
Kerning also helps identification: poor spacing in a logo can mean custom lettering, which is why the font identifier sometimes reports a “closest match” rather than an exact font.
Questions people ask
What is kerning?
Kerning is adjusting the space between two specific letters so the gaps look even. Pairs like AV, To and LY have shapes that leave awkward holes, so the font designer stores a negative or positive adjustment for them.
What is the difference between kerning and tracking?
Kerning changes the space between one pair of letters. Tracking (letter-spacing) changes the space across a whole word, line or paragraph evenly.
What is the difference between kerning and leading?
Kerning is horizontal space between letters; leading (line height) is vertical space between lines of text.
How do I turn on kerning in CSS?
Browsers apply a font’s built-in kerning by default for most text. You can force it with font-kerning: normal, or disable it with font-kerning: none. letter-spacing adjusts tracking, not kerning.
What is optical kerning?
Optical kerning (in Adobe apps) ignores the font’s kerning table and calculates spacing from the letter shapes. It helps with fonts that have poor or no kerning data. Metric kerning uses the font’s built-in pairs.