Line Height (Leading) Examples

leading-tight (1.25)

This paragraph demonstrates the "leading-tight" class. The quick brown fox jumps over the lazy dog. Lines of text are closer together, creating a more compact block of text. This can be useful for headings or short pieces of text where space is limited.

leading-normal (1.5)

This paragraph demonstrates the "leading-normal" class. The quick brown fox jumps over the lazy dog. This is typically the default line height for most browsers and provides good readability. It offers a balanced amount of space between lines.

leading-relaxed (1.625)

This paragraph demonstrates the "leading-relaxed" class. The quick brown fox jumps over the lazy dog. Lines of text have more space between them, making the text feel more airy and often easier to read for longer passages. This can enhance readability for extended content.

Skill: Adjust the space between lines of text.
Key Classes: leading-tight , leading-normal , leading-relaxed .
Where to apply: Paragraphs, long descriptions.