Categories / Tutorials

What’s the Difference Between Leading, Kerning and Tracking?

Adjusting leading, kerning, and tracking are key to typesetting, since they affect how spacing makes your text look proportional and readable. Here’s a comprehensive breakdown of each term and how you can adjust it all in Photoshop and Illustrator.

Creative Market March 31, 2021 · 4 min read
Pinterest
Before you become famous for creating the next best typeface, you have to learn the basics of type design. The first step to perfecting any new font is adjusting the leading, kerning and tracking, which affect the line spacing, letter spacing, and text to make it proportional and readable. What are these essential elements of typographic design? Well, here’s a fairly comprehensive breakdown of each term and how you can adjust them in Photoshop and Illustrator.

Leading

Leading is an essential design aspect that determines how text is spaced vertically in lines. For content that has multiple lines of readable text (like this blog), you’ll want to make sure the distance from the bottom of the words above to the top of the words below has appropriate spacing to make them legible. kerning tracking leading The leading is measured from the baseline of each line of text where the letters “sit.” Descenders, the parts of certain letters that are longer, such as a lowercase g, fall below the baseline. Ascenders are the opposite, letters with taller features, such as the letter h. They need to be considered as well when determining the leading distance. ALT ALT Traditionally, leading should be 20 percent greater than the font size; however, individual styles may call for different distances.

How to Adjust Leading in Photoshop and Illustrator

To adjust the leading of your font in Photoshop or Illustrator, open the Character palette, located under Window and then Character (Type → Character in Illustrator), and change the number in the leading field. The leading field is next to the type size. Don’t forget to highlight the text you want to change before adjusting it. kerning tracking leading

Kerning

Kerning also adjusts space, but of the distance between two letters. Set too closely together, words are indecipherable; set too far apart, and they’re awkward to read. Worse yet, if some letters have wider spacing and others narrower, it can be frustrating for someone to read without fully understanding what’s wrong. kerning tracking leading One of the most important aspects of successful kerning is to have proportional spacing between each letter, taking into consideration any serifs or stylistic flourishes that may need special attention. Most of the time, it just takes a keen eye, practice, and diligence to kern a font to precision. We’ve got many, many more kerning tips to share here.

How to Adjust Kerning in Photoshop and Illustrator

You can adjust the kerning of a font in Photoshop and Illustrator through the same Character palette that you use for leading. The kerning field is below the type size. It’s generally easier to use shortcuts for kerning, however. Place the cursor between the letters you want to kern and hold down the option key. Use the directional arrows to move the letters right or left until they’re perfect. kerning tracking leading Think you’re a master kerner? Try this awesome kerning browser game and test your skills.

Tracking

Tracking is often confused for kerning, but the concept is a little different. Tracking involves adjusting the spacing throughout the entire word. Once you’ve determined the right spacing between each letter, tracking can be used, with great restraint, to change the spacing equally between every letter at once. Tracking is generally used to fill a space that’s larger or smaller than currently suits the type’s parameters or to make a single word seem airy and impressive. You should be very careful when changing the tracking, as it can quickly lead to difficulty in reading. kerning tracking leading

How to Adjust Tracking in Photoshop and Illustrator

In the character palette in Photoshop and Illustrator, you can change the tracking by adjusting the number in the field below kerning. As with kerning, you can select the text you wish to alter and hold down the option key, pressing the directional arrows to adjust. kerning tracking leading

Know Your Terms

Whether you’re designing a website or a typeface, it’s worth knowing these concepts and how to wield them to improve your typography. And we haven’t even mentioned font formats, which are essential for a designer’s everyday work. Curious? We explained everything you need to know about OTFs and TTFs here. Are there any design terms that have tripped you up in the past? Let us know in the comments below. If you’re feeling extra confident, please join our 7-day challenge to become a typography expert.
Products Seen In This Post:
Lettering Worksheets
Getting started with hand lettering?
Free lettering worksheets

Download these worksheets and start practicing with simple instructions and tracing exercises.

Download now!
About the Author
Author
Creative Market

Making beautiful design simple & accessible to all.

View More Posts
Go to My Shop
Related Articles
11 Comments
  • thank you ! 7 years ago
  • thanks for this amazing article ! 7 years ago
  • Awesome!! Sometimes I forget which is for what,, great write up!! 7 years ago
  • Finally, I learned the difference between tracking and kerning. Thanks! 7 years ago
  • FYI: For good tracking sometimes it will help to put your design up site down. You'll better see the space between when you can't read it. 7 years ago
  • i learned to kern type many years ago, before computers. i had to cut and paste galleys of type on boards. Comes in handy now as a designer using a Mac! 6 years ago
  • ☝️If you add the "command" key (Mac) to the shortcut it adjusts in increments of 5 times the regular kerning or tracking adjustments. 5 years ago
  • Really great post!! I learned a lot Thanks! guys :) 5 years ago
  • Excellent article, thank you for share! 3 years ago
  • Kerning and tracking are a must for editorial design like we do at our studio http://www.brochuredesigner.org 3 years ago
  • Thanks for the creative way you employed to teach me! 3 years ago