6 tips for better line spacing in your typography

Rebecca Creger

Is your customer having a tough time reading the text on your design? Maybe it’s time to check the line spacing. Line spacing, or “leading”, is the amount of space between the baselines of each line of text. Correct leading is important because it gives multiple lines of text optimum legibility.

Line spacing example #1

The word “leading” comes from the days when printed materials were created with hot metal presses and lead blocks of varying thicknesses were used to create space between lines of text. For print, leading is now measured in point size. For web, it’s called line-height and is measured in points or percentages of the text size.

Here, we’ve rounded up 6 tips about leading to improve your typography:

1. Use the right software

For adjusting leading, programs like Adobe InDesign, Illustrator or Photoshop are your best bets. Whichever one you choose, you’ll using the Character panel to do so. You can find the character panel by clicking Window > Type > Character.

Line spacing example #2

The default setting for leading in most font software is 120% of the type size. For example, the auto/default leading for a 14 pt font will be 16.8 pt. To adjust leading, select your text box and choose a value from the drop-down menu in the character panel.

To do it using your keyboard, select your text box, hold down the option or alt key and press the up/down arrow keys to increase or decrease the leading.

2. Use looser leading for body copy

To do this, start with a leading value that is at least 2 pts above the text’s height. Be aware that too much leading can actually make body copy harder to read, so be judicious in your adjustments.

Line spacing example #3

3. Use different line spacing for different typefaces

Some typefaces, like Bernhard Modern, have shorter x-heights. This gives them the appearance of using less space.

On the other hand, typefaces like Helvetica Neue have taller x-heights that can make words appear more crowded. Typefaces with taller x-heights or longer ascenders and descenders often need more leading to make them more legible.

Line spacing example #4

4. When using colors other than black text on white, increase the leading

The most legible color combination in typography is black text on a white background. If you decide to use colors or light text on a dark background instead, it’s advised to increase your leading and use a lighter weight of your typeface.

Line spacing example #5

5. Use tighter leading in headlines

Headlines are key to creating hierarchy in your type layouts and act as a single unit, distinct from the body copy. One way to create that effect is to use negative leading(~2 pts or less) in headers with multiple lines.

Line spacing example #6

6. Test different leading heights

There isn’t always one right answer when it comes to leading because it depends on the design project that you’re working on. To find the best leading solution, compare a few solutions side by side in order to pick the best one. Which leading size do you think makes the paragraph the most legible?

Line spacing example #7

Got any leading/line spacing tips? Share in the comments!

The author

Rebecca Creger
Rebecca Creger

Rebecca was born and raised in the Bay Area, where she currently lives. She has a BFA in Design with a Visual Communications emphasis from UC Davis. Her passions include travel, design, pasta, and hanging out with her Beagle, Spud.

Related articles

How to create more fun and playful typography

How to create more fun and playful typography

Good typography may be hard work, but designers shouldn’t forget to have some fun with it! While crafting fonts and typographic characters can sometimes feel stiff and overly mathematical, we want you to help you find the joy in creating more expressive and playful typography. Of course, this approach is great for children-oriented design projects—but let’s not limit ourselves. After…

6 tips for better typographic hierarchy in web design

6 tips for better typographic hierarchy in web design

Have you ever looked at a design and thought, “Something doesn’t feel right”? If you can’t put your finger on what it is, the odds are good it’s an issue with your visual or typographic hierarchy.  When you cram content onto a page with a muddied mass of line breaks, bolded letters and italics—you’re sure…

Digital Fonts: A condensed history

Digital Fonts: A condensed history

More than ever before, designers today are tasked with designing with digital tools, for digital environments like web pages. The digital-to-print connection, once paramount, is now only one task among many. This change affects all aspects of design, but perhaps none more than typography, where the readability of digital fonts depends so much on the…

Current Design Contests

Designers, check out these contests so you can start building your career.
0%