Typography is like arranging guests at a dinner party. Some people need more elbow room. Some need to sit closer. Some rows need breathing space so nobody feels trapped. That is where leading, kerning, and tracking come in.
TLDR: Leading controls the space between lines. Kerning adjusts the space between two specific letters, like fixing the awkward gap in “A V.” Tracking changes spacing across a whole word or sentence. In one landing page test, increasing line spacing from 1.1 to 1.5 improved reading time by 18% because visitors could scan the text more easily.
Why Typography Spacing Matters
Good typography feels invisible. You do not notice it. You just read.
Bad typography is loud. It makes your eyes trip. It makes a logo feel cheap. It makes a headline look weird, even if you do not know why.
Spacing is a big part of that feeling. The right spacing makes text look clean, friendly, and professional. The wrong spacing can make text look crowded, broken, or sleepy.
Let’s break it down in a simple way.
What Is Leading?
Leading is the space between lines of text.
It is pronounced like ledding, not leeding. The name comes from old printing, when printers used strips of lead metal between lines. Fancy history. Very heavy spacing.
In modern design, leading is often called line height.
Here is the simple idea:
- Tight leading means lines sit close together.
- Loose leading means lines have more vertical space.
- Balanced leading makes reading feel smooth.
Leading Visual Example
Too tight:
This paragraph feels cramped. The lines almost touch each other. Your eyes may lose their place quickly. Reading starts to feel like doing tiny gymnastics.
Much better:
This paragraph feels calmer. Each line has room to breathe. Your eyes can move from one line to the next without stress.
When to Adjust Leading
Use more leading when text is long. Blog posts, reports, product descriptions, and emails usually need it.
Use tighter leading for short headlines. But be careful. If letters crash into each other, the headline starts to look like a traffic jam.
A handy rule:
- Body text often works well at 1.4 to 1.7 line height.
- Headlines often work well at 1.0 to 1.2 line height.
- Small text usually needs more leading, not less.
What Is Kerning?
Kerning is the space between two individual letters.
It is the tiny magic that makes letter pairs look natural.
Some letters create strange gaps because of their shapes. For example, the letters A and V can look too far apart. The letters T and o can also feel odd. Kerning fixes that.
Think of kerning as seating two awkward guests next to each other. You gently move their chairs so the table looks balanced.
Kerning Visual Example
Bad kerning:
A VAILABLE
Better kerning:
AVAILABLE
The second one feels more natural. The letters look like they belong together.
Where Kerning Matters Most
Kerning is very important in places where text is large or short.
- Logos
- Headlines
- Posters
- Book covers
- Navigation menus
- Buttons
Why? Because big text makes tiny spacing problems look huge. A small gap in body text may go unnoticed. A bad gap in a logo can scream, “Something is wrong!”
What Is Tracking?
Tracking is the space across a whole group of letters.
While kerning adjusts one letter pair, tracking adjusts many letters at once.
Tracking can make text feel elegant, bold, airy, serious, or cramped.
Tracking Visual Example
Tight tracking:
SUMMER SALE
Normal tracking:
SUMMER SALE
Wide tracking:
SUMMER SALE
Wide tracking can look stylish. It is often used for luxury brands, fashion, beauty, and minimal design. But too much tracking can make words hard to read.
When to Use Tracking
Use tracking when you want to change the overall mood of text.
- Use slightly wide tracking for uppercase headings.
- Use tight tracking for large, bold headlines if they feel too spread out.
- Avoid wide tracking on long paragraphs.
- Avoid tight tracking on small text.
Here is a quick tip. Uppercase letters often look better with a little extra tracking. Lowercase letters usually need less.
Leading vs Kerning vs Tracking
Now let’s compare them side by side.
| Term | Controls | Best Used For |
|---|---|---|
| Leading | Space between lines | Paragraphs, articles, captions |
| Kerning | Space between two letters | Logos, headlines, large type |
| Tracking | Space across many letters | Headings, labels, short phrases |
Here is the easiest way to remember it:
- Leading is line spacing.
- Kerning is couple spacing.
- Tracking is group spacing.
Simple. No design degree needed.
A Tiny Typography Story
Imagine you are designing a flyer for a coffee shop.
The headline says:
FRESH COFFEE DAILY
It looks okay. But not amazing.
First, you increase the tracking a little:
FRESH COFFEE DAILY
Now it feels more refined.
Then you check the kerning. The space between some letters feels uneven. You adjust those pairs by hand.
Finally, you edit the paragraph below the headline. The text feels crowded. You increase the leading from 1.2 to 1.55.
Suddenly, the flyer feels cleaner. More premium. More readable. Same words. Better spacing.
Common Typography Spacing Mistakes
Even good designers make spacing mistakes. The trick is learning to spot them.
1. Lines Are Too Close
If readers keep losing their place, your leading may be too tight. Add more space between lines.
2. Letters Look Uneven
If one part of a word looks like it has a random hole, check the kerning. Look at pairs like AV, WA, To, and Yo.
3. Words Feel Too Stretched
If a word looks like it is walking away from itself, tracking may be too wide.
4. Small Text Is Too Tight
Small text needs kindness. Give it enough tracking and leading so people do not squint.
Quick Rules for Better Spacing
- Zoom out. If the text feels gray and heavy, adjust spacing.
- Squint. Odd gaps become easier to see.
- Print it. Spacing problems often appear on paper.
- Check big text carefully. Kerning problems love headlines.
- Do not overdo it. Spacing should help the message, not steal the show.
Simple CSS Examples
If you work with web text, these CSS settings are useful.
Leading:
p {
line-height: 1.6;
}Tracking:
h1 {
letter-spacing: 2px;
}Kerning:
body {
font-kerning: normal;
}Most modern fonts include kerning data. Many browsers use it well. Still, large display text may need manual attention in design software.
Final Thoughts
Leading, kerning, and tracking are small details with big power.
Leading helps lines breathe. Kerning fixes awkward letter pairs. Tracking changes the spacing mood of whole words.
When these three work together, text feels polished. It becomes easier to read. It looks more intentional. Best of all, it makes your design feel like it knows what it is doing.
So next time your text feels “off,” do not panic. The words may be fine. The font may be fine. You may just need to move the chairs at the typography dinner party.