Planos a partir de R$ 32/mês Inscreva-se Agora

1.4 ~ 1.5 Line-Height para definir a altura da linha

Design | 3.403 | 30 de março de 2015
1.4 ~ 1.5 Line-Height para definir a altura da linha

Uma altura de linha de 1.4/1.5 X o tamanho do texto, geralmente é o ideal para corpos de texto na web. Considere este tamanho para tipografias semelhantes a Helvetica e Arial.

O que tentamos alcançar com essa regra é um texto que não fique muito grudado e nem muito separado.

See the Pen 77c7d2ca3f6a435a78334ab6a32f3e72 by André | Origamid (@origamid) on CodePen.

Vale lembrar que em títulos essa regra não se aplica. Geralmente quanto maior o tamanho do texto, menor deve ser a razão dele em relação a altura da linha.

Confie nos sites onde passamos a maior parte do nosso tempo como o Google, Facebook e sites de notícias como o Globo.

Essas são as características do corpo de texto destes sites:

Google
Tipografia: Arial
Tamanho: 13px
Line-height: 18px (~ 1.4em)

Facebook
Tipografia: San Francisco
Tamanho: 14px
Line-height: 19px (~ 1.35em)

Globo
Tipografia: Arial
Tamanho: 15px
Line-height: 22px (~ 1.45em)

Confira mais no ebook grátis de Tipografia em:

https://www.origamid.com/books/tipografia-para-web/

Mais Dicas

Como usar a função Calc de CSS

Dica #09 Tipografia – Góticas

Dica #04 Tipografia – Defina Uma Escala

Imagem em Preto e Branco com CSS

Dica #07 Tipografia – Egípcias