Calculadora de Altura de Linha

Calcule a altura de linha ideal para qualquer tamanho de fonte. Valores sem unidade, px, em e rem com pré-visualização ao vivo e recomendações WCAG.

px
8px 96px
0.8 3.0

WCAG recomenda pelo menos 1,5 para texto de corpo.

Predefinições

WCAG 1.4.12 exige que a altura de linha seja pelo menos 1,5× o tamanho da fonte para texto de corpo. A sua proporção atual 1.5 ✓ passes WCAG 1.4.12.

Resultados

Proporção sem unidade

1.5

Pixels

24px

Em

1.5em

Rem

1.5rem

Propriedade CSS

line-height: 1.5;

Pré-visualização ao vivo

A raposa marrom veloz salta sobre o cão preguiçoso. A tipografia importa — uma boa altura de linha torna o texto mais fácil de ler e mais acessível para todos os utilizadores.

font-size: 16px; line-height: 1.5;

O que é altura de linha?

A altura de linha (também chamada de entrelinhamento no design impresso) é a distância vertical entre linhas de texto, medida de uma linha de base à seguinte. Tem um grande impacto na legibilidade: muito compacta e o texto parece apertado; muito espaçada e o olho perde o fio.

Em CSS, a propriedade line-height aceita um número sem unidade (ex.: 1,5), um valor em pixels (24px), um valor em em ou rem (1,5em) ou uma percentagem. O valor sem unidade é geralmente preferido porque escala automaticamente com o tamanho de fonte de cada elemento.

Como calcular a altura de linha

  1. Escolha o tamanho da fonte em pixels (ex.: 16px para texto de corpo).
  2. Escolha uma proporção — 1,5 é um bom ponto de partida para texto de corpo, 1,1–1,2 para títulos.
  3. Multiplique o tamanho da fonte × proporção para obter o valor em pixels (ex.: 16 × 1,5 = 24px).
  4. Use a proporção sem unidade diretamente no CSS para melhor escalabilidade.
  5. Copie o resultado na unidade que melhor se adapta à sua folha de estilos.

Boas práticas

  • Use uma proporção sem unidade (ex.: 1,5) em vez de um valor px fixo para que a altura de linha escale com o tamanho da fonte.
  • Texto de corpo: procure 1,4–1,6. WCAG 1.4.12 exige pelo menos 1,5 para acessibilidade.
  • Títulos e texto de exibição: use uma proporção mais compacta de 1,1–1,3.
  • Texto pequeno (menos de 14px): aumente ligeiramente a proporção para manter a legibilidade.
  • Teste a altura de linha visualmente — parágrafos reais revelam problemas com mais clareza.

Perguntas frequentes

Qual é a altura de linha ideal para texto de corpo?

A maioria dos tipógrafos recomenda 1,4–1,6 para texto de corpo. O critério de sucesso WCAG 1.4.12 exige um mínimo de 1,5× o tamanho da fonte.

Por que usar uma proporção sem unidade em vez de pixels?

Uma proporção sem unidade (ex.: 1,5) herda o tamanho de fonte do elemento e escala corretamente. Um valor px fixo não se ajusta, o que pode causar sobreposição de texto se o tamanho da fonte for alterado.

Qual é a diferença entre altura de linha e entrelinhamento?

O entrelinhamento é um termo de tipografia impressa para o espaço vertical entre linhas. Em CSS, line-height controla a mesma medida, mas é distribuída por cima e por baixo de cada linha por padrão.

Os títulos devem ter uma altura de linha diferente do texto de corpo?

Sim. Títulos grandes geralmente ficam melhor com uma proporção mais compacta (1,1–1,2). O texto de corpo precisa de mais espaço (1,4–1,6) para guiar o olho pelas linhas.

Share this tool

Share a direct link or embed this tool on your site. Keep the Tooladex attribution link to support the project.