Line Height

How much vertical space each line of text occupies, which sets the gap between lines.

Where to find it
Labelled Typography → Line height in the "Selected Column" section of the Modify drawer.
Per device
Yes — you can set one value for every screen, or separate values for phone, tablet, and desktop.
Underlying CSS
lineHeight

In plain English

Line height is the distance from one line of text to the next — what a typesetter calls leading. It is the most under-appreciated setting on this list, and adjusting it does more for readability than almost anything else you can change.

Lines packed too tightly make the eye lose its place when it travels back to the left margin. Lines spread too far apart stop reading as a paragraph and start reading as a list. Somewhere between 1.4 and 1.6 times the font size is comfortable for body text.

The best way to set it is as a plain number with no unit — 1.5 means "one and a half times whatever the font size is". Because it is a multiplier, it keeps working when you change the font size or when a per-device value kicks in. You can also give an exact length, but then it stops adapting.

When you would use it

  • A paragraph feels cramped and hard to follow: try 1.5 or 1.6.
  • A large heading looks loose and disconnected: tighten it to around 1.1 or 1.2.
  • A dense table or list of short labels needs to be more compact.

How to change it

  1. Select the column, open "Selected Column", then "Typography", then "Line height".
  2. Enter a plain number such as 1.5 with no unit. This is the recommended approach.
  3. Only give a length with a unit when you need lines to land on an exact grid.
One value, or one per device? Every input in this setting sits under a “Same value for all resolutions” checkbox. Leave it checked for a single value everywhere, or uncheck it to give phones, tablets, and desktops their own. How per-device values work.

Watch out for

  • Larger text needs proportionally less line height, not more. A 48px headline at 1.5 looks like it is falling apart; 1.1 to 1.2 is right.
  • A line height set with a unit does not adapt when the font size changes, which can leave text overlapping. A unitless multiplier avoids this.
  • Longer lines need more line height. If you also widened the column, revisit this setting.

Related settings

For developers

The technical reference for what this setting produces: MDN: line-height. You do not need any of it to use the setting — it is there for whoever is building the components or debugging the published page.

Where to go next