Calculadora de Tamanho Rhythm Vertical Tipografia

Ritmo Vertical na Tipografia

Ritmo vertical é manter o espaçamento entre os elementos da página sempre consistente. Você consegue isso alinhando cada bloco (parágrafos, títulos, imagens, margens, padding) a múltiplos de um baseline que vem do line-height do corpo de texto. O baseline sai da conta baseline = font-size × line-height. Num corpo de 16 px com line-height 1,5, ele dá 24 px, e a partir daí toda medida vertical precisa cair num múltiplo de 24 (24, 48, 72, 96…).

Quem popularizou a ideia foi Robert Bringhurst em Elementos do Estilo Tipográfico, e Richard Rutter a levou para a web com “Compose to a Vertical Rhythm” (24ways 2006). Em 2014, a ferramenta Compose de Brent Jackson colocou tudo isso em código. Tim Brown depois esticou o conceito para tipografia em escala modular. O Material Design do Google resumiu a história toda no grid de 8 pt, em que cada margem, padding e altura de componente vira múltiplo de 8 px, caindo para 4 px nos itens finos.

Aplicações

Aparece no design editorial (interiores de livro, artigos long-form, revistas), nos design systems web como Material, Carbon e Polaris, e na UI de produto, onde o espaçamento regular reduz o ruído visual e facilita a leitura. O mesmo recurso reaparece em PDFs de relatório, dashboards e landing pages quando se busca um ar calmo e profissional.

FAQ

Por que ritmo vertical importa? Quando o espaçamento varia, a página fica inquieta. Alinhar tudo ao baseline dá ao olho pontos de descanso previsíveis, e a leitura flui melhor.

Imagens devem encaixar no baseline? Sempre que dá, sim. Redimensione ou acrescente padding para que a altura vire múltipla do baseline. Se não for possível, jogue a sobra na margem logo abaixo.

Grid de 4 pt ou 8 pt? O Material usa 8 pt como padrão. Em tabelas densas e ícones, onde 8 pt ficaria largo demais, desca para 4 pt.